/* ===========================================================================
   SolutionsChatops -- NAL's AI character "Avatar" as decoration, one pose
   (nal-ai-mascot-usage: at most 3 per page; Phong chose to reuse the Coding
   "peek" pose rather than commission a new one, 2026-10-10). Beside the
   画面イメージ heading, same technique as Coding/DataHub's mascot beside a
   heading: absolutely positioned in the section's own top-right corner, in
   space that is already empty, so the page does not get longer. Decorative:
   alt="" + aria-hidden, never in the way of a click. Shown from 1024px only.
   Source: assets/chatops-mascot-peek.webp, a copy of
   assets/coding-mascot-peek.webp (same cutout, reused as Phong asked).
   Latch reuses this page's own classes (co-feat-motion/co-feat-seen/
   co-feat-now, solutions-chatops-sections.js) -- no JS change needed.
   =========================================================================== */
.co-mascot { display: none; pointer-events: none; }
.co-mascot img { display: block; width: auto; height: 100%; }
@media (min-width: 1024px) {
  .co-has-mascot { position: relative; }
  .co-mascot { position: absolute; z-index: 1; right: 0; top: -22px; display: block; height: clamp(108px, 9vw, 136px); }
}
html.co-feat-motion .co-mascot[data-co-feat-latch]:not(.co-feat-seen) img { opacity: 0; transform: translateY(14px); }
.co-mascot.co-feat-seen img { transition: opacity 0.6s var(--ease-out) 0.2s, transform 0.7s var(--ease-out) 0.2s; }
.co-mascot.co-feat-now img { transition: none; }
