/* Bid — the Bidwise page guide (v13, Scult-pattern rebuild).
   The guide walks (transform) between anchors beside what you're reading
   and thinks out loud: a pale-lime thought cloud (#F4FFE9, dark-green
   text #13240A) on two little puffs, three thinking dots (#4E8A23),
   typewriter text, and one dark-green action pill (#0E1C07 / #E8FFD3).
   Lime glow halo #89FF37. Pitch-precise, light, premium. */

.bid-guide {
  position: fixed; left: 0; top: 0; width: 92px; height: 92px;
  z-index: 2147483000; pointer-events: none; opacity: 0;
  transition: opacity .35s ease;
  font-family: inherit;
}
.bid-guide.in { opacity: 1; }
.bid-catwrap { position: absolute; inset: 0; }
.bid-halo {
  position: absolute; inset: -18px; border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle, rgba(137,255,55,.48) 0%, rgba(137,255,55,.14) 45%, rgba(137,255,55,0) 68%);
  animation: bid-pulse 3.4s ease-in-out infinite; will-change: opacity;
}
@keyframes bid-pulse { 0%,100% { opacity: .65 } 50% { opacity: 1 } }
.bid-catbtn {
  position: absolute; inset: 0; padding: 0; border: 0; background: none; cursor: pointer;
  pointer-events: auto; -webkit-tap-highlight-color: transparent;
  animation: bid-bob 3.8s ease-in-out infinite;
}
.bid-catbtn:focus-visible { outline: 2px solid #89FF37; outline-offset: 4px; border-radius: 50%; }
.bid-catbtn .bid-svg { width: 92px; height: 88px; display: block; }
@keyframes bid-bob { 0%,100% { transform: translateY(0) } 50% { transform: translateY(-5px) } }
.bid-guide.bid-walking .bid-catbtn { animation: bid-walkbob .45s ease-in-out 2; }
@keyframes bid-walkbob { 0%,100% { transform: translateY(0) rotate(0deg) } 50% { transform: translateY(-8px) rotate(2deg) } }
.bid-guide.bid-jump .bid-catbtn { animation: bid-jump .6s cubic-bezier(.3,1.6,.5,1) 2; }
@keyframes bid-jump { 0%,100% { transform: translateY(0) } 40% { transform: translateY(-14px) } }
.bid-hide {
  position: absolute; top: -5px; right: -5px; width: 22px; height: 22px; padding: 0;
  border-radius: 50%; border: 1px solid rgba(255,255,255,.22); display: grid; place-items: center;
  background: rgba(9,9,11,.9); color: #A1A1AA; font-size: 11px; line-height: 1; cursor: pointer;
  opacity: 0; transform: scale(.7); transition: opacity .25s ease, transform .25s ease; pointer-events: auto;
}
.bid-guide:hover .bid-hide, .bid-guide:focus-within .bid-hide { opacity: 1; transform: none; }
.bid-hide:hover { color: #fff; }

/* --- thought cloud --- */
.bid-thought {
  position: absolute; bottom: calc(100% + 16px); width: 264px; max-width: 76vw;
  opacity: 0; visibility: hidden; transition: opacity .25s ease, visibility 0s linear .25s;
  pointer-events: none;
}
.bid-guide[data-flip="left"] .bid-thought { right: -14px; }
.bid-guide[data-flip="right"] .bid-thought { left: -14px; }
.bid-thought.show { opacity: 1; visibility: visible; transition: opacity .25s ease; pointer-events: auto; }
.bid-thought__body {
  position: relative; padding: 12px 17px 13px; color: #13240A; background: #F4FFE9;
  font-size: 15px; font-weight: 600; line-height: 1.36; letter-spacing: -.005em;
  border-radius: 26px 30px 28px 24px / 24px 26px 30px 28px;
  box-shadow: 0 18px 40px -12px rgba(0,0,0,.55);
}
.bid-thought__body::before, .bid-thought__body::after {
  content: ""; position: absolute; border-radius: 50%; background: #F4FFE9; z-index: -1;
}
.bid-thought__body::before { width: 30px; height: 30px; top: -9px; left: 16px; }
.bid-thought__body::after { width: 38px; height: 38px; top: -13px; left: 38px; }
.bid-puff { position: absolute; border-radius: 50%; background: #F4FFE9; box-shadow: 0 8px 16px -8px rgba(0,0,0,.55); }
.bid-guide[data-flip="left"] .bid-puff.p1 { right: 30px; bottom: -11px; width: 14px; height: 14px; }
.bid-guide[data-flip="left"] .bid-puff.p2 { right: 48px; bottom: -22px; width: 8px; height: 8px; }
.bid-guide[data-flip="right"] .bid-puff.p1 { left: 30px; bottom: -11px; width: 14px; height: 14px; }
.bid-guide[data-flip="right"] .bid-puff.p2 { left: 48px; bottom: -22px; width: 8px; height: 8px; }
.bid-thought__dots { display: none; gap: 6px; padding: 5px 4px; }
.bid-thought.thinking .bid-thought__dots { display: inline-flex; }
.bid-thought.thinking .bid-thought__text { display: none; }
.bid-thought__dots i { width: 8px; height: 8px; border-radius: 50%; background: #4E8A23; animation: bid-dot 1s ease-in-out infinite; }
.bid-thought__dots i:nth-child(2) { animation-delay: .15s; }
.bid-thought__dots i:nth-child(3) { animation-delay: .3s; }
@keyframes bid-dot { 0%,100% { transform: translateY(0); opacity: .55 } 50% { transform: translateY(-4px); opacity: 1 } }
.bid-thought__act {
  display: flex; align-items: center; gap: 6px; margin-top: 9px; height: 32px; padding: 0 13px;
  border: 0; border-radius: 999px; background: #0E1C07; color: #E8FFD3; cursor: pointer;
  font: 600 13px inherit; font-family: inherit; transition: transform .2s ease, box-shadow .2s ease;
}
.bid-thought__act:hover { transform: translateY(-1px); box-shadow: 0 6px 16px -6px rgba(137,255,55,.65); }
.bid-thought__act[hidden] { display: none; }

/* --- confetti --- */
.bid-confetti {
  position: fixed; width: 7px; height: 11px; border-radius: 2px; z-index: 2147483001;
  pointer-events: none; animation: bid-confetti 1.2s cubic-bezier(.15,.7,.3,1) forwards;
}
@keyframes bid-confetti { 0% { transform: translate(0,-6px) rotate(0deg); opacity: 1 } 100% { transform: translate(var(--cx), 130px) rotate(var(--cr)); opacity: 0 } }

/* --- cat face internals + moods --- */
.bid-svg .bid-head { transform-box: fill-box; transform-origin: 50% 88%; animation: bid-breathe 3.8s ease-in-out infinite; }
@keyframes bid-breathe { 0%,100% { transform: scale(1) } 50% { transform: scale(1.016) } }
.bid-svg .bid-pupil { transition: transform .1s linear; }
.bid-svg .bid-tail { transform-box: fill-box; transform-origin: 8% 85%; }
.bid-svg .bid-paw-wave { transform-box: fill-box; transform-origin: 50% 88%; }
.bid-svg .bid-brow { transform-box: fill-box; transform-origin: 50% 50%; transition: transform .25s ease; }
.bid-svg .bid-mouth-wobble { display: none; }
.bid-svg .bid-mouth-smile, .bid-svg .bid-mouth-worried { display: none; }
.bid-svg .bid-antenna { transform-origin: 50% 100%; }
.bid-guide[data-mood="thinking"] .bid-brow, .bid-guide[data-mood="worried"] .bid-brow, .bid-guide[data-mood="curious"] .bid-brow { opacity: 1; }
.bid-guide[data-mood="curious"] .bid-pupil circle { r: 2.6px; }
.bid-guide[data-mood="curious"] .bid-eye { rx: 10px; }
.bid-svg .bid-stars { opacity: 0; transform-box: fill-box; transform-origin: 50% 50%; }
.bid-guide[data-mood="happy"] .bid-mouth-neutral, .bid-guide[data-mood="celebrate"] .bid-mouth-neutral,
.bid-guide[data-mood="worried"] .bid-mouth-neutral, .bid-guide[data-mood="thinking"] .bid-mouth-smile { display: none; }
.bid-guide[data-mood="happy"] .bid-mouth-smile, .bid-guide[data-mood="celebrate"] .bid-mouth-smile { display: block; }
.bid-guide[data-mood="happy"] .bid-eye, .bid-guide[data-mood="celebrate"] .bid-eye { ry: 4.5px; }
.bid-guide[data-mood="thinking"] .bid-mouth-neutral { display: block; }
.bid-guide[data-mood="thinking"] .bid-brow { transform: rotate(9deg) translateY(-1px); }
.bid-guide[data-mood="curious"] .bid-brow { transform: rotate(-8deg) translateY(-2px); }

.bid-guide[data-mood="worried"] .bid-mouth-worried { display: block; }
.bid-guide[data-mood="worried"] .bid-mouth-neutral { display: none; }
.bid-guide[data-mood="worried"] .bid-brow { transform: rotate(16deg); }
.bid-guide[data-mood="sleepy"] .bid-eye { opacity: .45; }
.bid-guide[data-mood="celebrate"] .bid-stars { animation: bid-stars .9s ease-out 2; }
.bid-guide.bid-wag .bid-tail { animation: bid-tailwag .55s ease-in-out infinite; }
.bid-guide.bid-walking .bid-paw-wave { animation: bid-wave .45s ease-in-out 2; }
.bid-guide.bid-walking .bid-tail { animation: bid-tailwag .45s ease-in-out 2; }
@keyframes bid-tailwag { 0%,100% { transform: rotate(0deg) } 50% { transform: rotate(11deg) } }
@keyframes bid-wave { 0%,100% { transform: rotate(0deg) } 50% { transform: rotate(-26deg) } }
@keyframes bid-stars { 0% { opacity: 0; transform: scale(.5) } 35% { opacity: 1 } 100% { opacity: 0; transform: scale(1.25) translateY(-7px) } }

/* --- mobile --- */
@media (max-width: 760px) {
  .bid-guide { width: 76px; height: 76px; }
  .bid-catbtn .bid-svg { width: 76px; height: 72px; }
  .bid-thought { width: 232px; }
  .bid-thought__body { padding: 10px 14px 11px; font-size: 14px; }
  .bid-thought__body::before { width: 24px; height: 24px; top: -7px; }
  .bid-thought__body::after { width: 30px; height: 30px; top: -10px; left: 32px; }
}
@media (prefers-reduced-motion: reduce) {
  .bid-guide, .bid-guide * { animation: none !important; transition: none !important; }
}

/* thought flips below the cat when he's near the top of the screen */
.bid-guide[data-tpos="below"] .bid-thought { top: calc(100% + 16px); bottom: auto; }
.bid-guide[data-tpos="below"] .bid-puff.p1 { bottom: auto; top: -11px; }
.bid-guide[data-tpos="below"] .bid-puff.p2 { bottom: auto; top: -22px; }
.bid-guide[data-tpos="below"] .bid-thought__body::before { top: auto; bottom: -9px; }
.bid-guide[data-tpos="below"] .bid-thought__body::after { top: auto; bottom: -13px; }

/* landing squash after a hop */
.bid-guide.bid-land .bid-catbtn { animation: bid-land .27s ease-out; }
@keyframes bid-land { 0% { transform: scaleY(.86) translateY(3px) } 55% { transform: scaleY(1.06) translateY(-2px) } 100% { transform: scaleY(1) translateY(0) } }
