/* CHEETAHS mascot v2: ONE consistent character and responsive roaming. */
#cheetahGuide{--cg-orange:#ffad48;--cg-border:rgba(255,173,72,.55);position:fixed;left:auto;bottom:10px;width:196px;height:176px;z-index:210;pointer-events:none;isolation:isolate;transition:none}
#cheetahGuide *{box-sizing:border-box}
#cheetahGuide .cg-mascot{all:unset;box-sizing:border-box;display:block;position:absolute;right:0;bottom:0;width:196px;height:150px;cursor:pointer;pointer-events:auto;border-radius:16px;filter:drop-shadow(0 6px 7px rgba(0,0,0,.35));}
#cheetahGuide .cg-mascot:focus-visible{outline:3px solid #ffad48;outline-offset:-1px}
#cheetahGuide .cg-sprite{display:block;width:100%;height:100%;background-repeat:no-repeat;background-size:900% 100%;background-position:0% center;user-select:none;pointer-events:none;transform-origin:50% 80%;}
#cheetahGuide.cg-facing-right .cg-sprite{transform:scaleX(-1)}
#cheetahGuide .cg-message{position:absolute;right:0;bottom:149px;width:min(288px,calc(100vw - 22px));padding:13px 17px 13px 16px;border:1px solid var(--cg-border);border-radius:18px 18px 4px 18px;color:#fff4e7;background:rgba(29,17,10,.97);box-shadow:0 10px 34px #0006;font:500 13px/1.48 system-ui,-apple-system,'Segoe UI',sans-serif;opacity:0;transform:translateY(8px) scale(.97);visibility:hidden;transition:opacity .25s,transform .25s,visibility .25s;pointer-events:none}
#cheetahGuide .cg-message.cg-visible{opacity:1;visibility:visible;transform:translateY(0) scale(1)}
#cheetahGuide .cg-message::after{content:'';position:absolute;right:20px;bottom:-7px;width:12px;height:12px;background:#1d110a;border-right:1px solid var(--cg-border);border-bottom:1px solid var(--cg-border);transform:rotate(45deg)}
#cheetahGuide.cg-at-left .cg-message{left:0;right:auto;border-radius:18px 18px 18px 4px}
#cheetahGuide.cg-at-left .cg-message::after{right:auto;left:22px}
#cheetahGuide .cg-tag{display:block;margin-bottom:6px;color:#ffb45b;font:800 10px/1.35 ui-monospace,Consolas,monospace;letter-spacing:.12em}
#cheetahGuide .cg-message strong{font-weight:650;color:#fff7ef}
#cheetahGuide .cg-pulse{position:absolute;right:30px;bottom:10px;width:10px;height:10px;border-radius:50%;background:#ffb34b;box-shadow:0 0 0 4px #ffad4829;pointer-events:none}
#cheetahGuide.cg-silent .cg-pulse{background:#66554a;box-shadow:none}
@media(max-width:680px){#cheetahGuide{width:135px;height:133px;bottom:6px}#cheetahGuide .cg-mascot{width:135px;height:104px}#cheetahGuide .cg-message{bottom:103px;width:min(240px,calc(100vw - 18px));padding:12px 13px;font-size:12px}#cheetahGuide .cg-pulse{right:16px;bottom:4px}}
@media(prefers-reduced-motion:reduce){#cheetahGuide .cg-message{transition:none!important}}

/* v3: lively independently animated tail, seated mode only. */
#cheetahGuide .cg-mascot{isolation:isolate}
#cheetahGuide .cg-art{position:absolute;inset:0;display:block;transform-origin:50% 50%}
#cheetahGuide.cg-facing-right .cg-art{transform:scaleX(-1)}
#cheetahGuide.cg-facing-right .cg-sprite{transform:none}
#cheetahGuide .cg-tail{display:none;position:absolute;inset:0;background-position:center;background-repeat:no-repeat;background-size:100% 100%;transform-origin:66.5% 89%;pointer-events:none}
#cheetahGuide.cg-silent .cg-tail{display:block;animation:cgTailWag 1.25s ease-in-out infinite alternate}
#cheetahGuide .cg-sprite{position:absolute;inset:0;z-index:1}
@keyframes cgTailWag{0%{transform:rotate(-15deg)}50%{transform:rotate(13deg)}100%{transform:rotate(-15deg)}}
/* Keep moving tail and seated body facing in the same direction */
@media(prefers-reduced-motion:reduce){#cheetahGuide.cg-silent .cg-tail{animation-duration:4s}}

/* V4 · scroll-guided diagonal leaping — default start at top right. */
#cheetahGuide{
  top:110px;
  bottom:auto;
  will-change:left,top;
}
#cheetahGuide .cg-mascot{
  transform:translateY(var(--cg-hop,0px)) rotate(var(--cg-tilt,0deg));
  transform-origin:55% 85%;
}
#cheetahGuide.cg-leaping .cg-mascot{
  filter:drop-shadow(0 12px 14px rgba(0,0,0,.22));
}
/* When the guide is at the top, show its words beside it rather than offscreen. */
#cheetahGuide.cg-at-top .cg-message{
  bottom:22px;
  right:calc(100% + 10px);
  left:auto;
  border-radius:17px 17px 4px 17px;
}
#cheetahGuide.cg-at-top .cg-message::after{
  right:-6px;
  left:auto;
  bottom:26px;
  transform:rotate(-45deg);
}
#cheetahGuide.cg-at-top.cg-at-left .cg-message{
  left:calc(100% + 10px);
  right:auto;
  border-radius:17px 17px 17px 4px;
}
#cheetahGuide.cg-at-top.cg-at-left .cg-message::after{
  left:-6px;
  right:auto;
  transform:rotate(135deg);
}
/* Active mode grooming: standing cheetah, front paw raised in the same walking sprite. */
#cheetahGuide .cg-tongue{
  position:absolute;
  display:none;
  z-index:2;
  left:7%;
  top:28%;
  width:8px;
  height:13px;
  border-radius:0 0 100% 100%;
  background:#f17a86;
  border:1.5px solid #823c39;
  transform-origin:50% 0;
  animation:cgTongue 480ms ease-in-out infinite alternate;
  pointer-events:none;
}
#cheetahGuide.cg-grooming .cg-tongue{display:block}
@keyframes cgTongue{from{transform:scaleY(.25) rotate(-12deg)}to{transform:scaleY(1.1) rotate(8deg)}}
/* Keep the standing tail moving a little as the cat rests. */
#cheetahGuide.cg-grooming .cg-art{animation:cgBreathe 1.6s ease-in-out infinite alternate}
#cheetahGuide.cg-grooming.cg-facing-right .cg-art{animation:none}
@keyframes cgBreathe{from{translate:0 0}to{translate:0 -2px}}
#cheetahGuide.cg-silent .cg-tongue{display:none}
@media(max-width:680px){
  #cheetahGuide{top:105px;bottom:auto;}
  #cheetahGuide.cg-at-top .cg-message{bottom:25px;width:min(216px,calc(100vw - 158px));font-size:11px}
  #cheetahGuide .cg-tongue{width:5px;height:9px;}
}
@media(prefers-reduced-motion:reduce){
  #cheetahGuide .cg-mascot{transform:none!important}
  #cheetahGuide.cg-grooming .cg-art,#cheetahGuide .cg-tongue{animation:none!important}
}

/* CHEETAHS V5: never draw the extra tongue overlay, including cached older HTML. */
#cheetahGuide .cg-tongue{display:none!important;animation:none!important}

/* V6: turn visibly after landing, matching the direction of each hop. */
#cheetahGuide .cg-art{transition:transform .28s ease-in-out}
@media(prefers-reduced-motion:reduce){#cheetahGuide .cg-art{transition:none!important}}


/* V7: consistent high-quality sprite geometry and clean layering.
   The sheet has 9 cells of 424x298 pixels, so display at the same ratio. */
#cheetahGuide{z-index:9990!important;width:196px;height:163px;overflow:visible;pointer-events:none}
#cheetahGuide .cg-mascot{width:196px;height:138px;bottom:0;right:0;overflow:visible;touch-action:manipulation}
#cheetahGuide .cg-sprite{background-size:900% 100%;image-rendering:auto;backface-visibility:hidden}
#cheetahGuide .cg-art{will-change:transform}
#cheetahGuide .cg-message{bottom:140px}
#cheetahGuide.cg-at-top .cg-message{bottom:22px}
#cheetahGuide .cg-mascot::before,#cheetahGuide .cg-mascot::after{content:none}
@media(max-width:680px){
  #cheetahGuide{width:135px;height:119px}
  #cheetahGuide .cg-mascot{width:135px;height:95px}
  #cheetahGuide .cg-message{bottom:98px}
  #cheetahGuide.cg-at-top .cg-message{bottom:22px}
}


/* V8 / consistent seated drawing: the complete tail is now baked into each
   high-resolution seated frame. The old extra tail produced a double image. */
#cheetahGuide .cg-tail,
#cheetahGuide.cg-silent .cg-tail { display:none!important; animation:none!important; }
#cheetahGuide .cg-art, #cheetahGuide .cg-sprite { overflow:visible; }
#cheetahGuide .cg-sprite {
  background-repeat:no-repeat!important;
  background-size:900% 100%!important;
  image-rendering:auto;
  will-change:background-position;
}
#cheetahGuide.cg-silent .cg-art { animation:none!important; }
#cheetahGuide.cg-silent .cg-sprite { animation:none!important; }

/* V9: quiet mode has twelve hand-aligned frames; active mode remains nine. */
#cheetahGuide.cg-silent .cg-sprite {
  background-size:1200% 100%!important;
  background-repeat:no-repeat!important;
}

/* V11: natural sitting animation; no floating overlay paw, no extra tongue.
   24 full PNG frames with one consistent neck, shoulder and tail per frame. */
#cheetahGuide.cg-silent .cg-sprite {
  background-size:2400% 100%!important;
  background-repeat:no-repeat!important;
  image-rendering:auto!important;
}
#cheetahGuide.cg-silent .cg-tail,
#cheetahGuide.cg-silent .cg-tongue {
  display:none!important;
}

/* V12: full, undivided seated artwork from user-approved design. */
#cheetahGuide.cg-silent .cg-sprite{background-size:2400% 100%!important; background-position-y:center!important; image-rendering:auto!important;}

/* V14: 24 full transparent frames. Both neck and torso are identical across the quiet cycle. */
#cheetahGuide.cg-silent .cg-sprite{background-size:2400% 100%!important;background-repeat:no-repeat!important; image-rendering:auto!important;}
#cheetahGuide.cg-silent .cg-tail{display:none!important;}

/* V15: reference-matched nine source poses, 18 total full-body frames with animated tail and complete rest. */
#cheetahGuide.cg-silent .cg-sprite{background-size:1800% 100%!important;background-repeat:no-repeat!important;image-rendering:auto!important}
#cheetahGuide.cg-silent .cg-tail{display:none!important;animation:none!important}

/* FINAL: single flattened 24-frame high-resolution transparent sheet. */
#cheetahGuide.cg-silent .cg-sprite{background-size:2400% 100%!important;background-position-y:center!important;background-repeat:no-repeat!important;image-rendering:auto!important;}
#cheetahGuide.cg-silent .cg-tail,#cheetahGuide.cg-silent .cg-tongue{display:none!important;}
#cheetahGuide .cg-art,#cheetahGuide .cg-sprite{backface-visibility:hidden;}


/* USER GIF quiet mode: use the uploaded animated GIF directly when the cheetah is silenced. */
#cheetahGuide .cg-sprite.cg-gif-mode{
  background-size:contain!important;
  background-position:center bottom!important;
  background-repeat:no-repeat!important;
  image-rendering:auto!important;
}
#cheetahGuide.cg-silent .cg-sprite.cg-gif-mode{
  background-size:contain!important;
  background-position:center bottom!important;
  background-repeat:no-repeat!important;
}


/* User GIF silent state: transparent background + larger seated cheetah */
#cheetahGuide.cg-silent .cg-mascot{
  transform: scale(1.22) !important;
  transform-origin: 100% 100% !important;
}
#cheetahGuide.cg-silent.cg-at-left .cg-mascot{
  transform-origin: 0% 100% !important;
}
#cheetahGuide.cg-silent .cg-sprite.cg-gif-mode{
  background-color: transparent !important;
  background-size: contain !important;
  background-position: center bottom !important;
  background-repeat: no-repeat !important;
}
@media (max-width: 680px){
  #cheetahGuide.cg-silent .cg-mascot{transform: scale(1.12) !important;}
}


/* CHEETAHS 1.2 / guide fix: speech above the mascot, not behind its head. */
#cheetahGuide { overflow:visible !important; }
#cheetahGuide .cg-message { z-index:40; }
#cheetahGuide .cg-message::after { z-index:1; }
#cheetahGuide .cg-mascot { z-index:10; }
#cheetahGuide .cg-pulse { z-index:11; }

/* The narrow viewport cannot fit a 288px speech card beside the cheetah.
   Attach it above or below the mascot, never behind it or off-screen. */
@media (max-width:700px) {
  #cheetahGuide .cg-message,
  #cheetahGuide.cg-at-top .cg-message,
  #cheetahGuide.cg-at-top.cg-at-left .cg-message {
    width:min(260px, calc(100vw - 28px));
    max-width:calc(100vw - 28px);
    left:auto;
    right:0;
    top:auto;
    bottom:calc(100% + 11px);
    padding:13px 15px;
    font-size:12px;
    line-height:1.5;
    border-radius:16px;
    transform-origin:bottom right;
  }
  #cheetahGuide.cg-at-left .cg-message,
  #cheetahGuide.cg-at-top.cg-at-left .cg-message {
    left:0;
    right:auto;
    transform-origin:bottom left;
  }
  #cheetahGuide .cg-message::after,
  #cheetahGuide.cg-at-top .cg-message::after,
  #cheetahGuide.cg-at-top.cg-at-left .cg-message::after {
    top:auto;
    bottom:-7px;
    left:auto;
    right:105px; /* cheetah faces inward: point near its head, not its tail */
    border:0;
    border-right:1px solid var(--cg-border);
    border-bottom:1px solid var(--cg-border);
    transform:rotate(45deg);
  }
  #cheetahGuide.cg-at-left .cg-message::after,
  #cheetahGuide.cg-at-top.cg-at-left .cg-message::after {
    left:105px; /* left-edge cheetah faces right */
    right:auto;
  }
  #cheetahGuide.cg-bubble-below .cg-message,
  #cheetahGuide.cg-at-top.cg-bubble-below .cg-message,
  #cheetahGuide.cg-at-top.cg-at-left.cg-bubble-below .cg-message {
    bottom:auto;
    top:calc(100% + 11px);
    transform-origin:top right;
  }
  #cheetahGuide.cg-bubble-below.cg-at-left .cg-message {
    transform-origin:top left;
  }
  #cheetahGuide.cg-bubble-below .cg-message::after,
  #cheetahGuide.cg-at-top.cg-bubble-below .cg-message::after,
  #cheetahGuide.cg-at-top.cg-at-left.cg-bubble-below .cg-message::after {
    bottom:auto;
    top:-7px;
    border:0;
    border-left:1px solid var(--cg-border);
    border-top:1px solid var(--cg-border);
    transform:rotate(45deg);
  }
}


/* CHEETAHS guide 1.3: detached, viewport-anchored speech box.
   The old .cg-message selectors inside #cheetahGuide cannot interfere. */
#cheetahGuideSpeech{
  --cg-border:rgba(255,173,72,.55);
  position:fixed;
  z-index:9999;
  box-sizing:border-box;
  left:var(--cg-speech-x,auto);
  top:var(--cg-speech-y,auto);
  right:auto;
  bottom:auto;
  width:min(288px,calc(100vw - 24px));
  max-width:calc(100vw - 24px);
  padding:13px 17px 13px 16px;
  border:1px solid var(--cg-border);
  border-radius:17px;
  color:#fff4e7;
  background:rgba(29,17,10,.98);
  box-shadow:0 10px 34px #0009;
  font:500 13px/1.48 system-ui,-apple-system,'Segoe UI',sans-serif;
  opacity:0;
  visibility:hidden;
  transform:translateY(7px) scale(.98);
  transition:opacity .23s,transform .23s,visibility .23s;
  pointer-events:none;
}
#cheetahGuideSpeech.cg-visible{
  opacity:1;
  visibility:visible;
  transform:translateY(0) scale(1);
}
#cheetahGuideSpeech .cg-tag{
  display:block;
  margin-bottom:6px;
  color:#ffb45b;
  font:800 10px/1.35 ui-monospace,Consolas,monospace;
  letter-spacing:.12em;
}
#cheetahGuideSpeech strong{
  font-weight:650;
  color:#fff7ef;
}
#cheetahGuideSpeech::after{
  content:'';
  position:absolute;
  width:12px;
  height:12px;
  left:var(--cg-arrow-x,50%) ;
  bottom:-7px;
  top:auto;
  background:#1d110a;
  border-right:1px solid var(--cg-border);
  border-bottom:1px solid var(--cg-border);
  transform:translateX(-50%) rotate(45deg);
}
#cheetahGuideSpeech.cg-bubble-below::after{
  top:-7px;
  bottom:auto;
  transform:translateX(-50%) rotate(225deg);
}
@media(max-width:680px){
  #cheetahGuideSpeech{
    width:min(240px,calc(100vw - 24px));
    padding:12px 13px;
    font-size:12px;
    line-height:1.45;
  }
}
@media(prefers-reduced-motion:reduce){
  #cheetahGuideSpeech{transition:none;}
}

/* CHEETAHS | Long-press drag on desktop, tablets and phones.
   Short click / tap continues to toggle guide hints. */
#cheetahGuide .cg-mascot{
  touch-action:none !important;
  user-select:none !important;
  -webkit-user-select:none !important;
  -webkit-touch-callout:none !important;
  cursor:grab;
}
#cheetahGuide.cg-dragging .cg-mascot{
  cursor:grabbing !important;
}
#cheetahGuide.cg-dragging .cg-art{
  animation:none !important;
}

/* CHEETAHS: prevent iPhone text/image selection and native URL menu. */
#cheetahGuide, #cheetahGuide *, #cheetahGuideSpeech,
#cheetahGuide .cg-mascot, #cheetahGuide .cg-art,
#cheetahGuide .cg-sprite {
  -webkit-touch-callout: none !important;
  -webkit-user-select: none !important;
  user-select: none !important;
  -webkit-user-drag: none !important;
}
#cheetahGuide .cg-mascot {
  touch-action: none !important;
  -webkit-tap-highlight-color: transparent !important;
  cursor: grab !important;
}
#cheetahGuide.cg-dragging .cg-mascot {cursor: grabbing !important;}
