/* ============================================================
   ADVOCATE — the mark as the cursor.
   Spec: docs/reference/cursor-demo-v4.html (approved final).

   ONE form everywhere. No hover variant, no pressed variant, no
   per-component cursor: the mark is the pointer, and the only
   exception in the whole repo is the I-beam over editable text,
   which is information rather than decoration — it tells you the
   caret will land there.

   The stack is the spec's, in order:
     1. plain url()          — every browser, 24px
     2. -webkit-image-set()  — Safari and older Chromium
     3. image-set()          — the standard, HiDPI aware
   Later valid declarations win, so a browser takes the best form
   it understands and ignores the rest. Hotspot is 1 1 in all three
   — the apex tip, one pixel in from the corner, so a click lands
   where the point is aimed.

   The PNGs are supersampled bakes lifted byte-for-byte out of the
   spec (verified by sha256 in both directions), not re-rendered:
   rotation is in the pixels, so there is no SVG raster softness
   and no viewBox clipping.

   This file declares no colour and no layout. It is the only place
   in the repo that sets `cursor` at all — including the rail's grab
   state below, which is a cursor and therefore lives here rather than
   beside the component it describes.
   ============================================================ */

body {
  cursor: url(../assets/cursor/advocate-cursor-24.png) 1 1, auto;
  cursor: -webkit-image-set(
    url(../assets/cursor/advocate-cursor-24.png) 1x,
    url(../assets/cursor/advocate-cursor-48.png) 2x) 1 1, auto;
  cursor: image-set(
    url(../assets/cursor/advocate-cursor-24.png) 1x,
    url(../assets/cursor/advocate-cursor-48.png) 2x) 1 1, auto;
}

/* Interactive elements carry a UA default of their own, so they have
   to be told to inherit. Everything else inherits already — `cursor`
   is an inherited property. */
a,
button,
summary,
[role='button'] { cursor: inherit; }

/* The one exception. */
input,
textarea,
select,
[contenteditable] { cursor: text; }

/* ============================================================
   THE RAIL'S GROUND — the one STATE this file has (amended 2026-08-24,
   CARD-INTERACTION-CONTRACT v1.5).

   The sitewide rule is untouched: one mark, everywhere, no hover
   variant and no per-component cursor. What follows is not a second
   pointer for a component — it is the platform's own drag affordance
   on the one surface of the site that is dragged, and the reason it
   has to be written down at all is that the mark now covers it.

   The rail was always draggable and the browser was always showing
   grab on it, by inheriting nothing. Then the cards became controls:
   `[role='button'] { cursor: inherit }` above put the mark on every
   card front, and the row stopped saying it could be pushed. A row you
   can drag that says nothing about it is a row people scroll past.

   WHERE GRAB GOES, AND WHERE IT DOES NOT. The track and its cards are
   GROUND: you put a finger down and the row moves, and the 5px
   threshold in rail.js decides afterwards whether that was a drag or
   a press. Three things inside it are TARGETS rather than ground and
   keep the mark:

     the gate         the rail's door, and the one card whose entire
                      purpose is to be pressed
     any link         a link that says "you may drag me" is lying
                      about what a click will do
     an open back     choices, event chips, Back, Send, the foot link:
                      the visitor is in a form, and nothing in a form
                      is furniture

   Text inputs keep the I-beam from the rule above, which is more
   specific than the ground rule and stays more specific than it.

   THE STACK IS WRITTEN OUT TWICE, and it has to be. The three
   declarations are a fallback LADDER — a browser takes the last one it
   understands and ignores the rest — and a custom property cannot
   carry it: an unsupported value inside var() is invalid at
   computed-value time, which erases the declaration instead of falling
   back to the one above it. Keep the two blocks in step.
   ============================================================ */

.rail__track { cursor: grab; }

.rail__card--cta,
.rail__track a,
.rail__card--open .rail__face--back {
  cursor: url(../assets/cursor/advocate-cursor-24.png) 1 1, auto;
  cursor: -webkit-image-set(
    url(../assets/cursor/advocate-cursor-24.png) 1x,
    url(../assets/cursor/advocate-cursor-48.png) 2x) 1 1, auto;
  cursor: image-set(
    url(../assets/cursor/advocate-cursor-24.png) 1x,
    url(../assets/cursor/advocate-cursor-48.png) 2x) 1 1, auto;
}

/* DURING A DRAG THE WHOLE ROW IS THE HAND. `.is-dragging` is rail.js's
   own class and is already on the rail root while a pointer is down
   and moving. The descendant selector is what makes this outrank the
   three exceptions above: a drag begun on a card and carried across
   the gate must not change cursor halfway. */
.rail.is-dragging .rail__track,
.rail.is-dragging .rail__track * { cursor: grabbing; }