.robot{position:fixed;bottom:6px;left:0;z-index:45;display:flex;flex-direction:column;align-items:flex-start;pointer-events:none;will-change:transform}
.rb-body{pointer-events:auto;border:0;background:none;padding:0;cursor:pointer;display:flex;align-items:flex-end;gap:2px;-webkit-tap-highlight-color:transparent;filter:drop-shadow(0 8px 10px rgba(0,0,0,.35))}
.rb{display:block;transition:transform .3s}.rb-f{margin-right:-6px}
.robot[data-dir="l"] .rb{transform:scaleX(-1)}
.rb-svg{display:block;overflow:visible}
.rb-svg g{transform-box:fill-box}
.rb-ll,.rb-lr{transform-origin:50% 0}.rb-al,.rb-ar{transform-origin:50% 8%}.rb-head{transform-origin:50% 100%}
.robot[data-mode="walk"] .rb-svg{animation:rbBob .5s ease-in-out infinite}
.robot[data-mode="walk"] .rb-ll{animation:rbLeg .5s ease-in-out infinite}.robot[data-mode="walk"] .rb-lr{animation:rbLeg .5s ease-in-out -.25s infinite}
.robot[data-mode="walk"] .rb-al{animation:rbArm .5s ease-in-out -.25s infinite}.robot[data-mode="walk"] .rb-ar{animation:rbArm .5s ease-in-out infinite}
.robot[data-mode="wave"] .rb-ar{animation:rbWave .5s ease-in-out infinite}.robot[data-mode="wave"] .rb-head{animation:rbNod 1s ease-in-out infinite}
.robot[data-mode="idle"] .rb-head{animation:rbNod 2.4s ease-in-out infinite}
.rb-f .rb-svg{animation-delay:-.2s !important}
.rb-eyes{transform-origin:50% 50%;animation:rbBlink 4.2s infinite}
@keyframes rbBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes rbLeg{0%,100%{transform:rotate(22deg)}50%{transform:rotate(-22deg)}}
@keyframes rbArm{0%,100%{transform:rotate(26deg)}50%{transform:rotate(-26deg)}}
@keyframes rbWave{0%,100%{transform:rotate(-150deg)}50%{transform:rotate(-115deg)}}
@keyframes rbNod{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(4deg)}}
@keyframes rbBlink{0%,92%,100%{transform:scaleY(1)}95%{transform:scaleY(.1)}}
.robot.hop .rb-body{animation:rbHop .5s cubic-bezier(.3,1.6,.5,1)}
@keyframes rbHop{0%,100%{translate:0 0}45%{translate:0 -18px}}
.rb-bub{pointer-events:auto;position:relative;max-width:230px;margin:0 0 8px 6px;padding:9px 30px 9px 13px;border-radius:14px 14px 14px 4px;background:var(--surface);color:var(--text);border:1px solid color-mix(in srgb,var(--gold) 50%,transparent);box-shadow:var(--shadow);font-size:13px;line-height:1.6;opacity:0;transform:translateY(8px) scale(.9);transform-origin:0 100%;transition:opacity .25s,transform .3s cubic-bezier(.2,1.5,.4,1);visibility:hidden}
.rb-bub.on{opacity:1;transform:none;visibility:visible}
.robot.flip{align-items:flex-end}.robot.flip .rb-bub{border-radius:14px 14px 4px 14px;margin:0 6px 8px 0;transform-origin:100% 100%}
.pub ~ .robot .rb-bub,.robot.on-pub .rb-bub{background:#11333A;color:#F7F5F0}
.rb-x{position:absolute;top:4px;right:6px;width:22px;height:22px;border:0;background:none;color:var(--faint);cursor:pointer;font-size:16px;line-height:1;border-radius:6px}.rb-x:hover{background:var(--surface3);color:var(--text)}
.page{padding-bottom:110px}
.rb-img{object-fit:contain}.robot[data-mode="walk"] .rb-img{animation:rbBob .5s ease-in-out infinite}