/* ═══════════════════════════════════════════════════════════════════
   cursor.css — native cursors, for EVERY page
   ═══════════════════════════════════════════════════════════════════

   Split out of rock.css so that pages which should not take the whole
   rock palette (the archived duplicates, and the standalone motion piece
   that gets iframed into the Burger King case study) can still carry the
   cursors. Link it on every HTML document in the project.

   LINK IT LAST. Several components (.menu-btn, .showreel-cta,
   .bk-g-arrow, .yooz-mute-btn …) declare `cursor: pointer` on a class,
   which outranks a bare `button` selector and ties with `.hoverable`.
   Source order is what makes these rules win.

   IFRAMES NEED THEIR OWN COPY. A document in an iframe resolves the
   cursor from its own stylesheets — the parent's rules stop at the frame
   boundary. Without this file linked inside it, the pointer reverts to
   the system arrow the moment it crosses into an embedded document.

   THE FILES. Both .cur hold a single 24x24 frame with a BMP payload.
   Two things about that are load-bearing:

     • Single frame. They used to pack five, 16px up to 128px, and an
       ICO decoder picks the largest — which is why the cursor rendered
       enormous. Do not re-add large frames.

     • BMP payload, not PNG. PNG-compressed ICO/CUR is a late extension
       to the format and engines that predate it fail the whole cursor
       rather than falling back within it.

   The .png entries after each .cur are a second safety net for anything
   that cannot read the CUR container at all. PNGs carry no hotspot, so
   it is stated explicitly (1 0) to match the one baked into the .cur.

   Paths resolve against this stylesheet, not the linking page, so pages
   in subdirectories get the right files from `../cursor.css` for free.

   Elements with a meaningful cursor of their own (grab on the drag
   tracks, zoom-in on the reel items) are plain divs, so they are not
   matched here and keep theirs.
   ═══════════════════════════════════════════════════════════════════ */

/* !important, not source order. The original note here claimed that being
   last in the cascade was enough to beat components that declare their own
   `cursor: pointer` — it is not. Those declarations sit on classes
   (.g-arrow, .menu-btn, .showreel-cta, .yooz-mute-btn …) and a class beats
   the bare `button` element selector on specificity no matter what order
   the rules appear in. Fish King's gallery arrows were still showing the
   system pointer because of it.

   This is safe to force because the selector list only matches interactive
   elements. Components with a meaningful cursor of their own — grab on the
   drag tracks, zoom-in on the reel items — are plain divs, so they are
   never matched and keep theirs. */
html, body {
    cursor: url('pointer.cur'), url('pointer.png') 1 0, auto !important;
}

a, button, [role="button"], label, summary,
input[type="button"], input[type="submit"], .hoverable {
    cursor: url('cursor.cur'), url('cursor-hover.png') 1 0, pointer !important;
}

/* Legacy JS cursor followers from before the native switch. Hidden
   rather than deleted: several pages still hold references to these
   nodes in their pointermove handlers and would throw if they vanished. */
.cursor-dot, .cursor-outline, #fk-cursor, #fk-ring { display: none !important; }