/* Mo, the AI mascot (templates/_mo.html, static/mo.js). States on the root: st-idle, st-think, st-found, st-check,
   st-gone (below the floor), plus enter / exit while those play. Everything stops for prefers-reduced-motion. */
.mo { display: inline-block; vertical-align: middle; line-height: 0; }
.mo svg { display: block; width: 100%; height: auto; overflow: visible; }
.mo-s { width: 56px; } .mo-m { width: 96px; } .mo-l { width: 150px; }
.mo .mo-blades { transform-origin: 340px 44px; }
.mo .mo-act { transform-origin: 340px 192px; }
.mo .mo-eyes { transform-origin: 340px 131px; }
.mo .mo-happy, .mo .mo-dot, .mo .mo-scanline, .mo .mo-bit, .mo .mo-rain, .mo .mo-tip, .mo .mo-pool, .mo .mo-fx { opacity: 0; }
.mo .mo-burst { opacity: 0; transform-origin: 340px 230px; }
.mo .mo-slot { transform-origin: 340px 386px; transform: scale(0); }
.mo.st-found .mo-eye { opacity: 0; } .mo.st-found .mo-happy { opacity: 1; }
.mo.st-check .mo-iris { fill: #f0a93a; } .mo.st-check .mo-bezel { stroke: #b26b00; } .mo.st-check .mo-ring { stroke: #f0a93a; }
.mo.st-check .mo-under { opacity: .4; }
.mo.st-think .mo-iris { fill: #b8ffd9; }
.mo.st-think .mo-dot, .mo.st-think .mo-scanline, .mo.st-think .mo-fx, .mo.st-think .mo-pool { opacity: 1; }
.mo.st-think .mo-rain { opacity: .9; }
.mo.st-gone .mo-all { transform: translateY(250px); } .mo.st-gone .mo-shadow { opacity: 0; }
.mo .mo-dot { offset-path: path('M 268 230 A 72 15 0 1 1 412 230 A 72 15 0 1 1 268 230'); offset-rotate: 0deg; }
.mo .mo-bit-t { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 10px; }
.mo-s .mo-rain, .mo-s .mo-bit, .mo-s .mo-dot { display: none; }        /* too small to read: keep the screw, sparks and eyes */

@media (prefers-reduced-motion: no-preference) {
  .mo .mo-head { animation: mo-float 3.2s ease-in-out infinite alternate; }
  .mo .mo-cone { animation: mo-float2 3.2s ease-in-out infinite alternate; }
  .mo .mo-shadow { animation: mo-shadow 3.2s ease-in-out infinite alternate; transform-origin: 340px 384px; }
  .mo .mo-shine { animation: mo-shine 5s ease-in-out infinite; }
  .mo .mo-blades { animation: mo-spin 6s linear infinite; }
  .mo .mo-threads { animation: mo-screw 1.6s linear infinite; }
  .mo .mo-coneshine { animation: mo-conespin 3.2s ease-in-out infinite alternate; }
  .mo .mo-eye { animation: mo-blink 4.6s infinite; transform-box: fill-box; transform-origin: center; }
  .mo .mo-ring, .mo .mo-under { animation: mo-ring 1.8s ease-in-out infinite alternate; }
  .mo.st-think .mo-blades { animation-duration: .4s; }
  .mo.st-think .mo-act { animation: mo-busy .7s ease-in-out infinite alternate; }
  .mo.st-think .mo-eyes { animation: mo-scan .9s ease-in-out infinite alternate; }
  .mo.st-think .mo-threads { animation-duration: .14s; }
  .mo.st-think .mo-coneshine { animation: mo-conespin .28s linear infinite; }
  .mo.st-think .mo-cone { animation: mo-drill .08s linear infinite alternate; }
  .mo.st-think .mo-ring, .mo.st-think .mo-under { animation-duration: .3s; }
  .mo.st-think .mo-dot { animation: mo-orbit 1.1s linear infinite; }
  .mo.st-think .d2 { animation-delay: -.37s; } .mo.st-think .d3 { animation-delay: -.73s; }
  .mo.st-think .mo-scanline { animation: mo-scanv 1.1s ease-in-out infinite alternate; }
  .mo.st-think .mo-rain-col { animation: mo-rain linear infinite; }
  .mo.st-think .mo-bit { animation: mo-dig 1.1s ease-out infinite; }
  .mo.st-think .mo-tip { animation: mo-tip .12s ease-in-out infinite alternate; }
  .mo.st-found .mo-blades { animation-duration: 2s; }
  .mo.st-found .mo-act { animation: mo-hop 1.6s cubic-bezier(.3, .7, .4, 1) infinite; }
  .mo.st-found .mo-burst { animation: mo-burst 1.6s ease-out infinite; }
  .mo.st-check .mo-blades { animation-duration: 3.5s; }
  .mo.st-check .mo-act { animation: mo-tilt 1.8s ease-in-out infinite alternate; }
  .mo.enter .mo-all { animation: mo-rise 2.2s cubic-bezier(.2, .8, .25, 1) both; }
  .mo.enter .mo-pop { animation: mo-pop 2.2s cubic-bezier(.3, .9, .3, 1.2) both; }
  .mo.enter .mo-eyes { animation: mo-wake 2.2s ease-out both; }
  .mo.enter .mo-threads { animation: mo-screw .22s linear infinite; }
  .mo.enter .mo-blades { animation: mo-spin .4s linear infinite; }
  .mo.enter .mo-slot { animation: mo-slot 2.2s ease-in-out both; }
  .mo.enter .mo-shadow { animation: mo-shadowin 2.2s ease-out both; }
  .mo.enter .mo-burst { animation: mo-burst 2.2s ease-out .4s both; }
  .mo.exit .mo-all { animation: mo-sink 1.7s cubic-bezier(.55, 0, .75, .4) both; }
  .mo.exit .mo-pop { animation: mo-drop 1.7s ease-in both; }
  .mo.exit .mo-eyes { animation: mo-sleep 1.7s ease-in both; }
  .mo.exit .mo-threads { animation: mo-unscrew .22s linear infinite; }
  .mo.exit .mo-blades { animation: mo-spin 1.7s cubic-bezier(.2, .7, .6, 1) 1 reverse; }
  .mo.exit .mo-slot { animation: mo-slot 1.7s ease-in-out both; }
  .mo.exit .mo-shadow { animation: mo-shadowout 1.7s ease-in both; }
}
@media (prefers-reduced-motion: reduce) {
  .mo.enter .mo-all { animation: mo-fade .3s both; }
  .mo.exit .mo-all { animation: mo-fade .3s reverse both; }
}
@keyframes mo-float { to { transform: translateY(-12px); } }
@keyframes mo-float2 { to { transform: translateY(-4px); } }
@keyframes mo-drill { from { transform: translate(-1px, -3px); } to { transform: translate(1px, -2px); } }
@keyframes mo-shadow { to { transform: scale(.82); opacity: .1; } }
@keyframes mo-shine { 0%, 60% { transform: translateX(-170px); } 100% { transform: translateX(230px); } }
@keyframes mo-spin { to { transform: rotate(360deg); } }
@keyframes mo-blink { 0%, 92%, 100% { transform: scaleY(1); } 95% { transform: scaleY(.12); } }
@keyframes mo-ring { from { opacity: .3; } to { opacity: .9; } }
@keyframes mo-scan { from { transform: translateX(-10px); } to { transform: translateX(10px); } }
@keyframes mo-busy { from { transform: translateY(0) rotate(-3deg); } to { transform: translateY(-7px) rotate(3deg); } }
@keyframes mo-screw { from { transform: translateY(0); } to { transform: translateY(-12px); } }
@keyframes mo-unscrew { from { transform: translateY(-12px); } to { transform: translateY(0); } }
@keyframes mo-conespin { from { transform: translateX(-18px); } to { transform: translateX(18px); } }
@keyframes mo-orbit { from { offset-distance: 0%; } to { offset-distance: 100%; } }
@keyframes mo-scanv { from { transform: translateY(-22px); } to { transform: translateY(22px); } }
@keyframes mo-rain { from { transform: translateY(-80px); } to { transform: translateY(0); } }
@keyframes mo-dig { 0% { transform: translate(0, 0) scale(1); opacity: 0; } 20% { opacity: 1; } 100% { transform: translate(var(--dx), -44px) scale(.5); opacity: 0; } }
@keyframes mo-tip { from { opacity: .4; } to { opacity: 1; } }
@keyframes mo-hop { 0%, 100% { transform: translateY(0) scale(1, 1); } 12% { transform: translateY(0) scale(1.06, .93); } 38% { transform: translateY(-30px) scale(.97, 1.04); } 62% { transform: translateY(0) scale(1.04, .96); } 74% { transform: translateY(0) scale(1, 1); } }
@keyframes mo-burst { 0%, 30% { opacity: 0; transform: scale(.9); } 45% { opacity: .85; } 100% { opacity: 0; transform: scale(1.9); } }
@keyframes mo-tilt { from { transform: rotate(-7deg); } to { transform: rotate(7deg); } }
@keyframes mo-rise { 0% { transform: translateY(250px); } 55% { transform: translateY(-14px); } 70% { transform: translateY(5px); } 84%, 100% { transform: translateY(0); } }
@keyframes mo-pop { 0%, 48% { transform: translateY(40px); } 70% { transform: translateY(-16px); } 84% { transform: translateY(4px); } 100% { transform: translateY(0); } }
@keyframes mo-wake { 0%, 66% { transform: scaleY(.05); } 80% { transform: scaleY(1.2); } 90% { transform: scaleY(.9); } 100% { transform: scaleY(1); } }
@keyframes mo-slot { 0% { transform: scale(0); opacity: 0; } 14% { transform: scale(1); opacity: .6; } 72% { transform: scale(1); opacity: .6; } 100% { transform: scale(0); opacity: 0; } }
@keyframes mo-shadowin { 0%, 55% { opacity: 0; } 100% { opacity: .18; } }
@keyframes mo-shadowout { 0% { opacity: .18; } 40%, 100% { opacity: 0; } }
@keyframes mo-sink { 0%, 38% { transform: translateY(0); } 48% { transform: translateY(-10px); } 100% { transform: translateY(250px); } }
@keyframes mo-drop { 0% { transform: translateY(0); } 20% { transform: translateY(-12px); } 40%, 100% { transform: translateY(40px); } }
@keyframes mo-sleep { 0% { transform: scaleY(1); } 22%, 100% { transform: scaleY(.05); } }
@keyframes mo-fade { from { opacity: 0; } to { opacity: 1; } }

/* Where Mo sits */
.mo-line { display: flex; align-items: center; gap: 0.8rem; }
.mo-line .mo { flex: none; }
.ask-wait { display: none; align-items: center; gap: 0.6rem; }
.ask-wait.on { display: flex; }
.w-mo { display: block; margin: 0 auto -0.4rem; }
