/* Bee cursor: the arrow tip is the hotspot (3px 3px), so clicks land exactly where the point is.
   The bee rides along behind the arrow's tail. Falls back to the normal cursor if the image fails. */

/* I'M SO PROUD OF THIS. */

:root {
  --cursor-bee: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='42' height='42' viewBox='0 0 42 42'%3E%3Cdefs%3E%3CclipPath id='b'%3E%3Cellipse cx='30' cy='29' rx='6.5' ry='5'/%3E%3C/clipPath%3E%3C/defs%3E%3Cpath d='M3 3 L3 28 L9 22.5 L13.5 32 L18 30 L13.8 20.8 L22 20.8 Z' fill='%23fff' stroke='%23fff' stroke-width='4' stroke-linejoin='round'/%3E%3Cpath d='M3 3 L3 28 L9 22.5 L13.5 32 L18 30 L13.8 20.8 L22 20.8 Z' fill='%23ff7eb6' stroke='%232a1a4a' stroke-width='1.6' stroke-linejoin='round'/%3E%3Cellipse cx='27.5' cy='22.5' rx='2.8' ry='4.6' transform='rotate(-25 27.5 22.5)' fill='%23eaf4ff' stroke='%232a1a4a' stroke-width='1'/%3E%3Cellipse cx='32.5' cy='22' rx='2.8' ry='4.6' transform='rotate(15 32.5 22)' fill='%23eaf4ff' stroke='%232a1a4a' stroke-width='1'/%3E%3Cpath d='M23.8 29 L21.3 30.6 L23.8 31.6 Z' fill='%232a1a4a'/%3E%3Cellipse cx='30' cy='29' rx='6.5' ry='5' fill='%23ffc933'/%3E%3Cg clip-path='url(%23b)'%3E%3Crect x='27.2' y='23' width='2' height='12' fill='%232a1a4a'/%3E%3Crect x='31.4' y='23' width='2' height='12' fill='%232a1a4a'/%3E%3C/g%3E%3Cellipse cx='30' cy='29' rx='6.5' ry='5' fill='none' stroke='%232a1a4a' stroke-width='1.2'/%3E%3Ccircle cx='36.6' cy='29.4' r='2.5' fill='%232a1a4a'/%3E%3Ccircle cx='37.3' cy='28.6' r='0.7' fill='%23fff'/%3E%3C/svg%3E") 3 3, auto;
  --cursor-bee-link: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='42' height='42' viewBox='0 0 42 42'%3E%3Cdefs%3E%3CclipPath id='b'%3E%3Cellipse cx='30' cy='29' rx='6.5' ry='5'/%3E%3C/clipPath%3E%3C/defs%3E%3Cpath d='M3 3 L3 28 L9 22.5 L13.5 32 L18 30 L13.8 20.8 L22 20.8 Z' fill='%23fff' stroke='%23fff' stroke-width='4' stroke-linejoin='round'/%3E%3Cpath d='M3 3 L3 28 L9 22.5 L13.5 32 L18 30 L13.8 20.8 L22 20.8 Z' fill='%23d63a9a' stroke='%232a1a4a' stroke-width='1.6' stroke-linejoin='round'/%3E%3Cellipse cx='27' cy='21.5' rx='2.6' ry='5' transform='rotate(-40 27 21.5)' fill='%23eaf4ff' stroke='%232a1a4a' stroke-width='1'/%3E%3Cellipse cx='33' cy='21' rx='2.6' ry='5' transform='rotate(30 33 21)' fill='%23eaf4ff' stroke='%232a1a4a' stroke-width='1'/%3E%3Cpath d='M23.8 29 L21.3 30.6 L23.8 31.6 Z' fill='%232a1a4a'/%3E%3Cellipse cx='30' cy='29' rx='6.5' ry='5' fill='%23ffc933'/%3E%3Cg clip-path='url(%23b)'%3E%3Crect x='27.2' y='23' width='2' height='12' fill='%232a1a4a'/%3E%3Crect x='31.4' y='23' width='2' height='12' fill='%232a1a4a'/%3E%3C/g%3E%3Cellipse cx='30' cy='29' rx='6.5' ry='5' fill='none' stroke='%232a1a4a' stroke-width='1.2'/%3E%3Ccircle cx='36.6' cy='29.4' r='2.5' fill='%232a1a4a'/%3E%3Ccircle cx='37.3' cy='28.6' r='0.7' fill='%23fff'/%3E%3Cpath d='M13 6 L14.2 9.3 L17.5 10.5 L14.2 11.7 L13 15 L11.8 11.7 L8.5 10.5 L11.8 9.3 Z' fill='%23ffe36a' stroke='%232a1a4a' stroke-width='0.9' stroke-linejoin='round'/%3E%3C/svg%3E") 3 3, pointer;
}

html, body {
  cursor: var(--cursor-bee);
}

a, button, summary, label[for], [role="button"], input[type="submit"], select {
  cursor: var(--cursor-bee-link);
}

/* keep the text caret for typing: a bee would hide where you're clicking */
input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]), textarea, [contenteditable] {
  cursor: text;
}

/* themes set the cursor directly on .page-body and links, beating the inherited
   html/body value, so those selectors are restated here; this file loads after the
   theme stylesheets, so equal specificity wins */
:is(.page-body, [data-theme="scene"] .page-body, [data-theme="scene"][data-season="halloween"] .page-body) {
  cursor: var(--cursor-bee);
}

:is([data-theme="scene"] a, [data-theme="scene"] button, [data-theme="scene"] select) {
  cursor: var(--cursor-bee-link);
}

/* touch screens have no pointer, so nothing to change there */
@media (hover: none) {
  :is(html, body, a, button, .page-body, [data-theme="scene"] .page-body, [data-theme="scene"][data-season="halloween"] .page-body, [data-theme="scene"] a, [data-theme="scene"] button, [data-theme="scene"] select) { cursor: auto; }
}