/* Glim, the shopkeeper orb — see merchant-orb.jsx */
.orb{--lx:0;--ly:0;--hue:0deg;position:relative;flex:none;width:180px;height:210px;padding:0;background:none;border:0;cursor:pointer;-webkit-tap-highlight-color:transparent;outline:none}
.orb span,.orb i,.orb b{position:absolute;display:block;font-style:normal}
.orb-aura{left:50%;top:48%;width:230px;height:230px;margin:-115px;border-radius:50%;background:radial-gradient(circle,rgba(120,200,255,.45),rgba(140,90,255,.18) 45%,transparent 70%);animation:orb-aura 4s ease-in-out infinite;pointer-events:none;filter:hue-rotate(var(--hue));transition:filter .5s}
.orb-motes{inset:0;pointer-events:none}
.orb-motes i{left:50%;top:50%;width:5px;height:5px;border-radius:50%;background:#dff8ff;box-shadow:0 0 6px #9fe8ff;animation:orb-mote 6s linear infinite}
.orb-motes i:nth-child(2){animation-delay:-1.2s;animation-duration:7s;width:3px;height:3px}
.orb-motes i:nth-child(3){animation-delay:-2.6s;animation-duration:5.5s}
.orb-motes i:nth-child(4){animation-delay:-3.9s;animation-duration:8s;width:4px;height:4px;background:#ffd6f4}
.orb-motes i:nth-child(5){animation-delay:-4.8s;animation-duration:6.5s;width:3px;height:3px;background:#fff3b0}
.orb-float{inset:0;animation:orb-float 4s ease-in-out infinite}
.orb-lean{inset:0;transform:rotate(calc(var(--lx) * 9deg)) translateX(calc(var(--lx) * 6px));transition:transform .4s cubic-bezier(.3,1.4,.5,1)}
.orb-body{left:50%;top:52px;width:120px;height:120px;margin-left:-60px;transform-origin:50% 60%}
.orb-ball{inset:0;border-radius:50%;overflow:hidden;filter:hue-rotate(var(--hue));transition:filter .5s;
  background:radial-gradient(circle at 34% 28%,#fff 0,#d8f6ff 9%,#7fd6ff 30%,#6a6cff 66%,#2b1880 100%);
  box-shadow:0 0 34px rgba(110,200,255,.65),0 0 80px rgba(130,90,255,.35),inset -12px -16px 30px rgba(25,5,80,.55),inset 6px 8px 18px rgba(255,255,255,.35)}
.orb-core{inset:-20%;background:conic-gradient(from 0deg,transparent,rgba(255,255,255,.35),transparent 25%,rgba(180,120,255,.4) 50%,transparent 70%,rgba(120,255,240,.3) 85%,transparent);mix-blend-mode:screen;animation:orb-spin 9s linear infinite;opacity:.7}
.orb-shine{left:22px;top:16px;width:30px;height:18px;border-radius:50%;background:rgba(255,255,255,.85);filter:blur(2px);transform:rotate(-30deg)}
.orb-face{left:50%;top:50%;width:70px;height:50px;margin:-20px 0 0 -35px;transform:translate(calc(var(--lx) * 12px),calc(var(--ly) * 9px));transition:transform .25s ease-out}
.orb-eye{top:4px;width:16px;height:22px;border-radius:50%;background:#1b1048;animation:orb-blink 5s infinite;transition:height .2s,width .2s,border-radius .2s,transform .2s,margin .2s,background .2s}
.orb-eye:nth-of-type(3){left:12px}.orb-eye:nth-of-type(4){right:12px;animation-delay:.08s}
.orb-eye b{left:3px;top:3px;width:6px;height:6px;border-radius:50%;background:#fff;transform:translate(calc(var(--lx) * 2px),calc(var(--ly) * 2px))}
.orb-eye b::after{content:"";position:absolute;left:7px;top:8px;width:3px;height:3px;border-radius:50%;background:#fff;opacity:.8}
.orb-brow{top:-4px;width:15px;height:4px;border-radius:4px;background:#1b1048;opacity:0;transition:all .25s}
.orb-brow:nth-of-type(1){left:12px}.orb-brow:nth-of-type(2){right:12px}
.orb-blush{top:25px;width:13px;height:7px;border-radius:50%;background:#ff7ab8;opacity:.55;filter:blur(1.5px);transition:opacity .3s}
.orb-blush:nth-of-type(5){left:1px}.orb-blush:nth-of-type(6){right:1px}
.orb-mouth{left:50%;top:31px;width:14px;height:6px;margin-left:-7px;border-radius:0 0 10px 10px;background:#1b1048;transition:all .2s}
.orb.is-talking .orb-mouth{animation:orb-talk .18s ease-in-out infinite alternate}
.orb-hat{left:50%;top:-30px;width:40px;height:34px;margin-left:-8px;transform:rotate(14deg);transform-origin:50% 100%;transition:transform .3s}
.orb-hat::before{content:"";position:absolute;left:-9px;right:-9px;bottom:0;height:8px;border-radius:50%;background:linear-gradient(#3b2a5c,#1d1233);box-shadow:0 2px 3px rgba(0,0,0,.35)}
.orb-hat::after{content:"";position:absolute;left:4px;right:4px;bottom:4px;top:0;border-radius:4px 4px 2px 2px;background:linear-gradient(90deg,#1d1233,#3d2c63 45%,#22163c)}
.orb-hat i{left:4px;right:4px;bottom:8px;height:7px;z-index:1;background:linear-gradient(90deg,#c0401f,#ff7a45 50%,#c0401f)}
.orb-hat i::after{content:"";position:absolute;right:4px;top:-4px;width:8px;height:12px;border-radius:50% 50% 50% 0;background:#ffd36b;transform:rotate(30deg)}
.orb-ring{left:50%;top:112px;width:184px;height:46px;margin:-23px 0 0 -92px;border-radius:50%;border:2px solid rgba(200,230,255,.45);transform:rotate(-14deg);box-shadow:0 0 12px rgba(150,200,255,.4);pointer-events:none;animation:orb-ring 6s ease-in-out infinite}
.orb-ring.is-front{clip-path:inset(50% 0 0 0)}
.orb-hand{top:132px;width:24px;height:24px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#a9e6ff 35%,#6a6cff 85%);box-shadow:0 0 12px rgba(110,200,255,.6);animation:orb-hand 4s ease-in-out infinite;transition:transform .35s cubic-bezier(.3,1.5,.5,1)}
.orb-hand.is-left{left:6px}.orb-hand.is-right{right:6px;animation-delay:-2s}
.orb-spark{left:50%;top:128px;width:14px;height:14px;margin-left:-7px;background:#fff6c0;clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%);filter:drop-shadow(0 0 4px #ffd36b);opacity:0}
.orb-shadow{left:50%;bottom:2px;width:96px;height:12px;margin-left:-48px;border-radius:50%;background:rgba(30,10,0,.35);filter:blur(5px);animation:orb-shadow 4s ease-in-out infinite}
.orb-z{right:14px;top:22px;font:800 14px/1 system-ui;color:#c9b8ff}
.orb-z b{opacity:0;animation:orb-z 3s ease-out infinite}.orb-z b:nth-child(2){animation-delay:1s;font-size:17px}.orb-z b:nth-child(3){animation-delay:2s;font-size:21px}
.orb-hearts{left:50%;top:40px}
.orb-hearts b{width:12px;height:12px;background:#ff7ab8;clip-path:path("M6 11 C-4 4 2 -2 6 3 C10 -2 16 4 6 11Z");opacity:0;animation:orb-heart 1.6s ease-out forwards}
.orb-hearts b:nth-child(1){left:-50px}.orb-hearts b:nth-child(2){left:34px;animation-delay:.2s}.orb-hearts b:nth-child(3){left:-8px;top:-24px;animation-delay:.4s}
.orb:hover .orb-ball{filter:hue-rotate(var(--hue)) brightness(1.08)}
.orb:focus-visible .orb-ball{box-shadow:0 0 0 3px #fff,0 0 34px rgba(110,200,255,.65)}

/* moods */
.orb.is-talking .orb-hand.is-right{transform:translateY(-14px) rotate(-20deg);animation:orb-gesture .6s ease-in-out infinite alternate}
.orb.is-happy{--hue:-35deg}
.orb.is-happy .orb-body{animation:orb-hop .6s cubic-bezier(.3,1.6,.5,1)}
.orb.is-happy .orb-eye{height:10px;background:none;border-top:4px solid #1b1048;border-radius:50% 50% 0 0/100% 100% 0 0;margin-top:6px}
.orb.is-happy .orb-eye b{display:none}
.orb.is-happy .orb-mouth{width:22px;height:12px;margin-left:-11px}
.orb.is-happy .orb-blush{opacity:.9}
.orb.is-happy .orb-hand.is-left{animation:orb-clap-l .3s ease-in-out 4 alternate}.orb.is-happy .orb-hand.is-right{animation:orb-clap-r .3s ease-in-out 4 alternate}
.orb.is-wow{--hue:60deg}
.orb.is-wow .orb-body{animation:orb-squish .5s cubic-bezier(.3,1.8,.5,1)}
.orb.is-wow .orb-eye{width:20px;height:24px;margin-top:-2px}
.orb.is-wow .orb-brow{opacity:1;top:-12px}
.orb.is-wow .orb-mouth{width:13px;height:15px;margin-left:-6.5px;border-radius:50%}
.orb.is-wow .orb-hand{transform:translateY(-34px)}
.orb.is-wow .orb-hat{transform:rotate(-6deg) translateY(-12px)}
.orb.is-sad{--hue:30deg}
.orb.is-sad .orb-ball{filter:hue-rotate(var(--hue)) saturate(.5) brightness(.85)}
.orb.is-sad .orb-float{animation:orb-float 6s ease-in-out infinite;top:12px}
.orb.is-sad .orb-eye{height:15px;margin-top:6px}
.orb.is-sad .orb-brow{opacity:1;top:2px}.orb.is-sad .orb-brow:nth-of-type(1){transform:rotate(-22deg)}.orb.is-sad .orb-brow:nth-of-type(2){transform:rotate(22deg)}
.orb.is-sad .orb-mouth{top:34px;border-radius:10px 10px 0 0;height:5px}
.orb.is-sad .orb-hand{transform:translateY(16px)}
.orb.is-sad .orb-hat{transform:rotate(26deg) translate(6px,4px)}
.orb.is-poke .orb-body{animation:orb-squish .5s cubic-bezier(.3,1.8,.5,1)}
.orb.is-poke .orb-eye{height:5px;margin-top:9px;border-radius:3px}
.orb.is-poke .orb-eye b{display:none}
.orb.is-poke .orb-brow{opacity:1;top:0}.orb.is-poke .orb-brow:nth-of-type(1){transform:rotate(22deg)}.orb.is-poke .orb-brow:nth-of-type(2){transform:rotate(-22deg)}
.orb.is-poke .orb-mouth{width:10px;height:10px;margin-left:-5px;border-radius:50%}
.orb.is-poke .orb-hat{animation:orb-hat-pop .6s cubic-bezier(.3,1.5,.5,1)}
.orb.is-sleep{cursor:default}.orb.is-sleep .orb-ball{filter:saturate(.5) brightness(.7)}.orb.is-sleep .orb-float{animation-duration:7s}
.orb.is-sleep .orb-eye{height:3px;margin-top:11px;border-radius:3px;animation:none}.orb.is-sleep .orb-eye b{display:none}
.orb.is-sleep .orb-mouth{width:7px;height:7px;margin-left:-3.5px;border-radius:50%}.orb.is-sleep .orb-aura{opacity:.4}
.orb.is-sleep .orb-hat{transform:rotate(-24deg) translate(-26px,8px)}.orb.is-sleep .orb-hand{transform:translateY(12px)}
/* idle fidgets */
.orb.idle-look .orb-face{animation:orb-look 1.8s ease-in-out}
.orb.idle-spin .orb-body{animation:orb-twirl 1.2s cubic-bezier(.5,0,.3,1)}
.orb.idle-yawn .orb-mouth{animation:orb-yawn 1.8s ease-in-out}.orb.idle-yawn .orb-eye{animation:orb-yawn-eye 1.8s ease-in-out}
.orb.idle-juggle .orb-spark{animation:orb-juggle 1.8s ease-in-out}
.orb.idle-juggle .orb-hand.is-left{animation:orb-toss .9s ease-in-out 2}.orb.idle-juggle .orb-hand.is-right{animation:orb-toss .9s ease-in-out .45s 2}
.orb.idle-tip .orb-hat{animation:orb-tip 1.8s ease-in-out}.orb.idle-tip .orb-hand.is-right{animation:orb-tip-hand 1.8s ease-in-out}

@keyframes orb-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
@keyframes orb-shadow{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(.75);opacity:.6}}
@keyframes orb-aura{0%,100%{transform:scale(1);opacity:.9}50%{transform:scale(1.12);opacity:.6}}
@keyframes orb-spin{to{transform:rotate(360deg)}}
@keyframes orb-mote{0%{transform:rotate(0) translateX(96px) scale(.6);opacity:0}20%{opacity:1}50%{transform:rotate(180deg) translateX(80px) scale(1)}80%{opacity:1}100%{transform:rotate(360deg) translateX(96px) scale(.6);opacity:0}}
@keyframes orb-blink{0%,93%,100%{transform:scaleY(1)}95%{transform:scaleY(.1)}}
@keyframes orb-talk{from{height:4px}to{height:11px;width:16px;margin-left:-8px;border-radius:0 0 50% 50%/0 0 100% 100%}}
@keyframes orb-ring{0%,100%{transform:rotate(-14deg)}50%{transform:rotate(-6deg) scaleX(.96)}}
@keyframes orb-hand{0%,100%{translate:0 0}50%{translate:0 -8px}}
@keyframes orb-gesture{from{translate:0 0}to{translate:-4px -10px}}
@keyframes orb-hop{0%{transform:scale(1)}20%{transform:scale(1.12,.88)}45%{transform:translateY(-30px) scale(.94,1.06) rotate(8deg)}75%{transform:translateY(-4px) rotate(-4deg)}100%{transform:none}}
@keyframes orb-squish{0%{transform:scale(1)}30%{transform:scale(1.18,.82)}60%{transform:scale(.92,1.08)}100%{transform:scale(1)}}
@keyframes orb-clap-l{to{translate:42px -14px}}@keyframes orb-clap-r{to{translate:-42px -14px}}
@keyframes orb-z{0%{opacity:0;transform:translate(0,10px)}30%{opacity:1}100%{opacity:0;transform:translate(16px,-26px)}}
@keyframes orb-heart{0%{opacity:0;transform:translateY(10px) scale(.4)}30%{opacity:1}100%{opacity:0;transform:translateY(-44px) scale(1.2)}}
@keyframes orb-hat-pop{40%{transform:rotate(-20deg) translateY(-26px)}}
@keyframes orb-look{0%,100%{translate:0 0}25%,40%{translate:-12px -2px}60%,75%{translate:12px -2px}}
@keyframes orb-twirl{to{transform:rotate(360deg)}}
@keyframes orb-yawn{0%,100%{height:6px}35%,65%{height:18px;width:16px;margin-left:-8px;border-radius:50%}}
@keyframes orb-yawn-eye{0%,100%{transform:scaleY(1)}35%,65%{transform:scaleY(.15)}}
@keyframes orb-juggle{0%{opacity:0;translate:-60px 10px}10%{opacity:1}30%{translate:0 -70px}50%{translate:60px 10px}70%{translate:0 -70px}90%{opacity:1;translate:-60px 10px}100%{opacity:0}}
@keyframes orb-toss{50%{translate:0 -12px}}
@keyframes orb-tip{0%,100%{transform:rotate(14deg)}30%,70%{transform:rotate(-10deg) translate(10px,-24px)}}
@keyframes orb-tip-hand{0%,100%{translate:0 0}30%,70%{translate:-24px -84px}}
@media (prefers-reduced-motion:reduce){.orb *{animation:none!important}}

/* stress ball */
.orb{touch-action:none;user-select:none;-webkit-user-select:none}
.orb-squish{inset:0;transform-origin:50% 53%;will-change:transform}
.orb.is-held{cursor:grabbing}
.orb:not(.is-sleep){cursor:grab}
.orb.is-held .orb-eye{height:6px;margin-top:9px;border-radius:3px;background:#1b1048;animation:none}
.orb.is-held .orb-eye b{display:none}
.orb.is-held .orb-eye:nth-of-type(3){transform:rotate(18deg)}.orb.is-held .orb-eye:nth-of-type(4){transform:rotate(-18deg)}
.orb.is-held .orb-mouth{width:16px;height:9px;margin-left:-8px;border-radius:50%}
.orb.is-held .orb-blush{opacity:1}
.orb.is-held .orb-hand{transform:translateY(-10px) scale(.9)}
.orb.is-held .orb-float{animation-play-state:paused}
