/* 小糯：编辑器和购买页共用。颜色变量没定义的话用默认值 */
/* ================= 小糯 ================= */
.mochi { position: fixed; z-index: 40; right: 18px; bottom: 16px; width: 76px; transition: opacity .3s, transform .3s; }
.mochi.hide { opacity: 0; transform: translateY(20px); pointer-events: none; }
.mochi-body { display: block; width: 100%; padding: 0; border: none; background: none; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.mochi-body svg { display: block; width: 100%; overflow: visible; transform-origin: 50% 100%; animation: squish 3s ease-in-out infinite; }
@keyframes squish { 0%, 100% { transform: scale(1, 1); } 50% { transform: scale(1.04, .95); } }
.mochi .sprout { transform-box: fill-box; transform-origin: 50% 100%; animation: sprout 2.4s ease-in-out infinite; }
@keyframes sprout { 0%, 100% { transform: rotate(-8deg); } 50% { transform: rotate(8deg); } }
.mochi .eyes { transition: transform .15s ease-out; }
.mochi.blink .eyes { transform: scaleY(.1) !important; transform-box: fill-box; transform-origin: center; }
.mochi .happy-eyes, .mochi .sleep-eyes, .mochi .mouth-o { opacity: 0; }
.mochi.m-happy .eyes, .mochi.asleep .eyes { opacity: 0; }
.mochi.m-happy .happy-eyes { opacity: 1; }
.mochi.m-o .mouth { opacity: 0; } .mochi.m-o .mouth-o { opacity: 1; }
.mochi.asleep .sleep-eyes { opacity: 1; }
.mochi.asleep svg { animation-duration: 5s; }
.mochi.hop svg { animation: hop .6s cubic-bezier(.3, 1.6, .5, 1); }
@keyframes hop { 0%, 100% { transform: translateY(0) scale(1, 1); } 30% { transform: translateY(-18px) scale(.94, 1.08); } 60% { transform: translateY(0) scale(1.1, .88); } }
.mochi-bubble { position: absolute; right: 64px; bottom: 58px; width: max-content; max-width: 210px; padding: 9px 13px; border-radius: 16px 16px 4px 16px;
  background: #fff; color: var(--ink, #2a1f2d); font-size: 13px; line-height: 1.45; box-shadow: 0 8px 24px rgba(42, 31, 45, .18), inset 0 0 0 1px var(--line, #ece3dc);
  opacity: 0; transform: translateY(6px) scale(.92); transform-origin: 100% 100%; transition: opacity .2s, transform .3s cubic-bezier(.2, 1.4, .4, 1); pointer-events: none; }
.mochi.talk .mochi-bubble { opacity: 1; transform: none; }
.mochi-heart { position: fixed; z-index: 41; color: var(--rose, #e2678a); font-size: 16px; pointer-events: none; animation: mochiHeart 1.4s ease-out forwards; }
@keyframes mochiHeart { from { opacity: 1; transform: translate(0, 0) scale(.6); } to { opacity: 0; transform: translate(var(--dx), -70px) scale(1.2); } }
@media (max-width: 900px) {
  .mochi { width: 56px; right: 12px; bottom: calc(68px + env(safe-area-inset-bottom, 0px)); }
  .mochi-bubble { right: 48px; bottom: 44px; max-width: 180px; }
  body.view-preview .mochi { opacity: .9; }
}
@media (prefers-reduced-motion: reduce) { .mochi-body svg, .mochi .sprout { animation: none !important; } }

.jts-fx { position: fixed; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 70; }