/* ============================================================
   ADOL — Energy cursor
   Canvas + target glow for js/energy-cursor.js.

   Everything here is gated on (hover: hover) and (pointer: fine). A touch
   device must not merely hide the canvas — it must never have the native
   cursor taken away in the first place, because there is nothing to replace it
   with. The script checks the same query before it starts.
   ============================================================ */

.energy-cursor {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  /* Above the loader (100) and the flow carousel's cream veil (90): the
     cursor is the one thing that must never be covered. */
  z-index: 2147483000;
  pointer-events: none;
  display: none;
}

@media (hover: hover) and (pointer: fine) {
  .energy-cursor { display: block; }

  /* Hide the system pointer only once the canvas is actually running, so a
     WebGL failure or an unsupported browser is left with a normal cursor
     rather than no cursor at all. */
  html.energy-cursor-on,
  html.energy-cursor-on body,
  html.energy-cursor-on a,
  html.energy-cursor-on button,
  html.energy-cursor-on [role='button'],
  html.energy-cursor-on label,
  html.energy-cursor-on summary {
    cursor: none;
  }

  /* Give the caret back over anything you type into. The article editor is a
     contenteditable — writing in it without an I-beam is guesswork, and no
     particle effect is worth that. The script also hides its own fixation dot
     here so the two never appear at once. */
  html.energy-cursor-on input,
  html.energy-cursor-on textarea,
  html.energy-cursor-on select,
  html.energy-cursor-on [contenteditable='true'],
  html.energy-cursor-on [contenteditable=''] {
    cursor: auto;
  }
  html.energy-cursor-text,
  html.energy-cursor-text body {
    cursor: auto;
  }

  /* ---- charging target ----
     Added by the script when the pointer comes within 120px. Deliberately
     restrained: this fires on every link on the page, so anything loud would
     turn reading into a light show. */
  .is-charging {
    transition: box-shadow 0.28s var(--ease-out, ease-out),
                color 0.28s var(--ease-out, ease-out),
                border-color 0.28s var(--ease-out, ease-out),
                text-shadow 0.28s var(--ease-out, ease-out);
  }

  /* Block-ish targets take a glow ring. */
  button.is-charging,
  .btn.is-charging,
  .chip.is-charging,
  .interactive-card.is-charging,
  .pcard.is-charging,
  .flow-card.is-charging,
  .tteaser-card.is-charging,
  [data-cursor='magnetic'].is-charging {
    box-shadow:
      0 0 0 1px rgba(245, 158, 11, 0.5),
      0 0 26px -6px rgba(245, 158, 11, 0.75);
  }

  /* Inline links can't take a box-shadow without looking boxed-in. */
  a.is-charging:not(.btn):not(.pcard__link):not(.flow-card):not(.tteaser-card) {
    text-shadow: 0 0 14px rgba(245, 158, 11, 0.6);
  }

  /* The gold buttons already glow; deepen rather than double up. */
  .btn--gold.is-charging {
    box-shadow: 0 0 30px -4px rgba(245, 158, 11, 0.85);
  }
}

/* Reduced motion: the script drops to a plain halo and stops emitting, but the
   target glow would still flicker on every pointer pass — hold it still. */
@media (prefers-reduced-motion: reduce) {
  .is-charging { transition: none; }
}

/* A coarse pointer never gets here, but belt and braces: if the class somehow
   survives onto a touch device, the native cursor comes straight back. */
@media (hover: none), (pointer: coarse) {
  html.energy-cursor-on,
  html.energy-cursor-on body { cursor: auto; }
  .energy-cursor { display: none; }
}