/* ChumSum 0.0.0.18: Graay mascot (server/mascot.py, js/mascot.js). Bottom-left corner, above the taskbar. */
.cs-mascot{position:fixed;left:12px;bottom:12px;z-index:9100;display:flex;align-items:flex-end;gap:4px;
  max-width:min(380px,calc(100vw - 24px));font:13px/1.4 Tahoma,"MS Sans Serif",Verdana,Geneva,sans-serif;color:#000;pointer-events:none}
.cs-mascot[hidden]{display:none!important}
html.theme-retro .cs-mascot{bottom:calc(var(--tb-h,40px) + 10px)}
.cs-mascot>*{pointer-events:auto}
.csm-sprite{width:96px;height:96px;flex:0 0 96px;object-fit:contain;object-position:bottom;image-rendering:pixelated;image-rendering:crisp-edges;
  -webkit-user-drag:none;user-select:none;filter:drop-shadow(2px 2px 0 rgba(0,0,0,.25))}
.csm-bubble{position:relative;margin:0 0 58px 0;padding:8px 28px 8px 10px;background:#ffffe1;border:2px solid #000;border-radius:10px;
  box-shadow:3px 3px 0 rgba(0,0,0,.35);min-width:180px}
.csm-bubble::before,.csm-bubble::after{content:"";position:absolute;left:-14px;bottom:10px;border-style:solid;border-width:8px 14px 8px 0;
  border-color:transparent #000 transparent transparent}
.csm-bubble::after{left:-10px;bottom:12px;border-width:6px 11px 6px 0;border-color:transparent #ffffe1 transparent transparent}
.csm-bubble:focus-visible,.cs-mascot button:focus-visible{outline:2px dotted #000080;outline-offset:2px}
.csm-name{display:block;font-weight:bold;font-size:11px;color:#000080;margin:0 0 2px}
.csm-text{margin:0 0 6px}
.csm-acts{display:flex;gap:6px;flex-wrap:wrap}
.cs-mascot button{font:inherit;font-size:12px;padding:2px 8px;background:#c0c0c0;color:#000;border:2px outset #fff;border-radius:0;cursor:pointer}
.cs-mascot button:active{border-style:inset}
.cs-mascot .csm-x{position:absolute;top:3px;right:3px;width:20px;height:18px;padding:0;line-height:14px;font-size:11px}
/* motion (all off for prefers-reduced-motion) */
.cs-mascot.csm-in{animation:csm-pop .28s ease-out}
.csm-sprite.csm-bob{animation:csm-bob 1.6s ease-in-out infinite}
@keyframes csm-pop{from{transform:translateY(24px);opacity:0}to{transform:none;opacity:1}}
@keyframes csm-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@media (max-width:700px){.csm-sprite{width:64px;height:64px;flex-basis:64px}.csm-bubble{margin-bottom:38px;min-width:0}
  html.theme-retro body.signed-in .cs-mascot{bottom:calc(var(--tb-h,48px) + 8px)}}
@media (prefers-reduced-motion:reduce){.cs-mascot,.cs-mascot *{animation:none!important;transition:none!important}}