/* ============================================================================
   真真 · 智能体助手样式（v4.11.0）
   ----------------------------------------------------------------------------
   命名空间：浮窗层用 zz- 前缀；真真 SVG 内部沿用 my-/m-（定稿状态机，勿改）
   z-index：250（高于 toast 200，低于拍照遮罩 300）
   体积：本文件独立加载，不进 index.html
   ========================================================================== */

/* ============ 一、真真 SVG 五态状态机（从定稿迁移） ============ */

/* 默认隐藏"非待机"的元素，由状态类切换显示 */
.zz-mascot .m-eyes-happy,.zz-mascot .m-eyes-sleep,.zz-mascot .m-mouth-open,
.zz-mascot .m-mark-alert,.zz-mascot .m-mark-q,.zz-mascot .m-zzz{opacity:0}
/* 平滑过渡：状态切换时不闪跳 */
.zz-mascot .m-body,.zz-mascot .m-shadow,.zz-mascot .m-eyes-open,
.zz-mascot .m-ahoge{transition:all .3s}
.zz-mascot .m-eyes-open{transform-origin:center 34%}

/* —— 待机：呼吸 + 眨眼 + 蓝线轻摆 —— */
.zz-mascot.st-idle .m-body{animation:my-breathe 3.4s ease-in-out infinite;transform-origin:center 88%}
.zz-mascot.st-idle .m-eyes-open{animation:my-blink 4.2s ease-in-out infinite}
.zz-mascot.st-idle .m-ahoge{animation:my-sway 3s ease-in-out infinite;transform-origin:50% 100%}

/* —— 开心：蹦跳 + 弯月眼 —— */
.zz-mascot.st-happy .m-body{animation:my-bounce .64s ease-in-out infinite;transform-origin:center 92%}
.zz-mascot.st-happy .m-eyes-open{opacity:0}
.zz-mascot.st-happy .m-eyes-happy{opacity:1}
.zz-mascot.st-happy .m-mouth-idle{opacity:0}
.zz-mascot.st-happy .m-mouth-open{opacity:1}
.zz-mascot.st-happy .m-shadow{animation:my-shadow .64s ease-in-out infinite;transform-origin:center}

/* —— 提醒：抖动 + 感叹号弹出 —— */
.zz-mascot.st-alert .m-body{animation:my-shake .5s ease-in-out infinite;transform-origin:center 92%}
.zz-mascot.st-alert .m-mark-alert{animation:my-pop .5s cubic-bezier(.2,1.7,.4,1) forwards}
.zz-mascot.st-alert .m-eyes-open{animation:my-blink 1.6s ease-in-out infinite}

/* —— 思考：歪头 + 问号淡入 —— */
.zz-mascot.st-think .m-body{animation:my-tilt 2.8s ease-in-out infinite;transform-origin:center 92%}
.zz-mascot.st-think .m-mark-q{animation:my-fade .6s .25s forwards}
.zz-mascot.st-think .m-eyes-open{animation:my-blink 3.4s ease-in-out infinite}

/* —— 睡觉：压扁 + Zzz + 蓝线松垂 —— */
.zz-mascot.st-sleep .m-body{animation:my-flat 3.2s ease-in-out infinite;transform-origin:center 92%}
.zz-mascot.st-sleep .m-eyes-open{opacity:0}
.zz-mascot.st-sleep .m-eyes-sleep{opacity:1}
.zz-mascot.st-sleep .m-mouth-idle{opacity:0}
.zz-mascot.st-sleep .m-zzz{animation:my-zzz 2.8s ease-in-out infinite}
.zz-mascot.st-sleep .m-ahoge{transform:rotate(125deg);transform-origin:50% 92%}

/* —— 真真专属：睡觉时蓝线软软垂下（不用全局的 125° 大回转） —— */
.zz-mascot.st-sleep .m-wire .m-ahoge{transform:translateY(6px)}
/* —— 真真专属：整体绕针尖小幅摇摆，针尖朝地 —— */
.zz-mascot .m-wire{transform-origin:118px 178px}
.zz-mascot.st-idle .m-wire{animation:my-needleNod 3.4s ease-in-out infinite}
.zz-mascot.st-happy .m-wire{animation:my-needleJump .64s ease-in-out infinite}
.zz-mascot.st-alert .m-wire{animation:my-needleShake .42s ease-in-out infinite}
.zz-mascot.st-think .m-wire{animation:my-needleTilt 2.8s ease-in-out infinite}
.zz-mascot.st-sleep .m-wire{animation:my-needleSleep 3.2s ease-in-out infinite}

/* —— 关键帧 —— */
@keyframes my-breathe{0%,100%{transform:scaleY(1)}50%{transform:scaleY(1.035)}}
@keyframes my-blink{0%,92%,100%{transform:scaleY(1)}95%{transform:scaleY(.08)}}
@keyframes my-bounce{0%,100%{transform:translateY(0) scaleY(1)}30%{transform:translateY(-14px) scaleY(1.04)}55%{transform:translateY(0) scaleY(.94)}75%{transform:translateY(-5px)}}
@keyframes my-shadow{0%,100%{transform:scaleX(1);opacity:1}30%{transform:scaleX(.72);opacity:.6}}
@keyframes my-shake{0%,100%{transform:rotate(0)}25%{transform:rotate(-4.5deg)}75%{transform:rotate(4.5deg)}}
@keyframes my-pop{0%{transform:scale(0) rotate(-30deg);opacity:0}70%{transform:scale(1.25) rotate(8deg);opacity:1}100%{transform:scale(1) rotate(0);opacity:1}}
@keyframes my-fade{to{opacity:1}}
@keyframes my-tilt{0%,100%{transform:rotate(0)}40%{transform:rotate(-7deg)}70%{transform:rotate(3deg)}}
@keyframes my-flat{0%,100%{transform:scaleY(1)}50%{transform:scaleY(.93) scaleX(1.05)}}
@keyframes my-zzz{0%{transform:translateY(4px);opacity:.2}45%{opacity:1}100%{transform:translateY(-14px);opacity:0}}
@keyframes my-sway{0%,100%{transform:rotate(-7deg)}50%{transform:rotate(7deg)}}
@keyframes my-needleNod{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(4deg)}}
@keyframes my-needleJump{0%,100%{transform:translateY(0) rotate(-6deg)}30%{transform:translateY(-14px) rotate(4deg)}55%{transform:translateY(0) rotate(-3deg)}75%{transform:translateY(-5px) rotate(2deg)}}
@keyframes my-needleShake{0%,100%{transform:rotate(-11deg)}50%{transform:rotate(1deg)}}
@keyframes my-needleTilt{0%,100%{transform:rotate(-4deg)}40%{transform:rotate(-12deg)}70%{transform:rotate(-1deg)}}
@keyframes my-needleSleep{0%,100%{transform:rotate(0)}50%{transform:rotate(-2deg) translateY(3px)}}

/* ============ 二、浮窗层（zz- 前缀） ============ */

#zzMascotRoot{position:fixed;right:22px;bottom:22px;z-index:250;
  font-family:-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;pointer-events:none}
#zzMascotRoot>*{pointer-events:auto}

/* —— 折叠态：右下角小圆点 —— */
.zz-dot{width:52px;height:52px;border-radius:50%;background:#fff;border:1px solid var(--border,#e4e8f2);
  box-shadow:0 6px 20px -6px rgba(23,32,64,.3);cursor:pointer;display:flex;align-items:center;
  justify-content:center;transition:transform .2s,box-shadow .2s;position:relative}
.zz-dot:hover{transform:translateY(-2px) scale(1.04);box-shadow:0 10px 26px -8px rgba(43,92,255,.42)}
.zz-dot svg{width:34px;height:34px;display:block}
.zz-dot .zz-badge{position:absolute;top:-2px;right:-2px;min-width:17px;height:17px;border-radius:9px;
  background:#ff6b81;color:#fff;font-size:10.5px;font-weight:700;line-height:17px;text-align:center;
  padding:0 4px;box-shadow:0 2px 6px rgba(255,107,129,.5)}
.zz-dot .zz-badge.hidden{display:none}

/* —— 展开态容器 —— */
.zz-fly{display:flex;flex-direction:column;align-items:flex-end;gap:10px}

/* —— 气泡 —— */
.zz-bubble{max-width:290px;background:#fff;border:1px solid var(--border,#e4e8f2);
  border-radius:16px 16px 4px 16px;padding:11px 14px;font-size:12.8px;line-height:1.78;
  color:var(--text,#16203a);box-shadow:0 10px 28px -12px rgba(23,32,64,.36);
  opacity:0;transform:translateY(8px);transition:opacity .22s,transform .22s}
.zz-bubble.on{opacity:1;transform:translateY(0)}
.zz-bubble .zz-bubble-more{margin-top:7px;display:inline-block;font-size:11.5px;font-weight:700;
  color:var(--primary,#2b5cff);cursor:pointer;user-select:none}
.zz-bubble .zz-bubble-more:hover{text-decoration:underline}

/* —— 真真本体（展开态） —— */
.zz-body{width:112px;cursor:pointer;transition:transform .2s;filter:drop-shadow(0 6px 14px rgba(23,32,64,.16))}
.zz-body:hover{transform:translateY(-3px)}
.zz-body svg{width:100%;height:auto;display:block}

/* —— 面板 —— */
.zz-panel{position:fixed;right:22px;bottom:22px;width:430px;max-width:calc(100vw - 32px);
  max-height:min(620px,calc(100vh - 100px));background:var(--card,#fff);border:1px solid var(--border,#e4e8f2);
  border-radius:var(--r-card,16px);box-shadow:0 24px 60px -20px rgba(23,32,64,.42);
  display:flex;flex-direction:column;overflow:hidden;z-index:250}
.zz-panel.hidden{display:none}
.zz-panel-head{display:flex;align-items:center;gap:10px;padding:12px 15px;
  border-bottom:1px solid var(--line,#eef0f4);background:linear-gradient(180deg,#fbfcff,#f5f8ff)}
.zz-panel-head .zz-panel-face{width:34px;height:34px;flex:0 0 34px}
.zz-panel-head .zz-panel-face svg{width:100%;height:100%;display:block}
.zz-panel-head .zz-panel-title{flex:1;font-size:14px;font-weight:700;color:var(--text,#16203a)}
.zz-panel-head .zz-panel-title small{display:block;font-size:11px;font-weight:400;
  color:var(--text-3,#8f97ab);margin-top:2px}
.zz-iconbtn{border:1px solid var(--border,#e4e8f2);background:#fff;color:var(--text-2,#5a6478);
  width:28px;height:28px;border-radius:8px;font-size:14px;line-height:1;cursor:pointer;
  display:flex;align-items:center;justify-content:center;transition:all .16s;padding:0}
.zz-iconbtn:hover{border-color:rgba(43,92,255,.45);color:var(--primary,#2b5cff)}
.zz-iconbtn.on{background:var(--primary,#2b5cff);border-color:var(--primary,#2b5cff);color:#fff}

/* —— 快捷查询按钮 —— */
.zz-quick{display:flex;flex-wrap:wrap;gap:6px;padding:11px 15px 4px}
.zz-quick button{border:1px solid var(--border,#e4e8f2);background:#fff;color:var(--text-2,#5a6478);
  font-size:12px;font-weight:600;border-radius:9px;padding:6px 11px;cursor:pointer;transition:all .16s;
  font-family:inherit}
.zz-quick button:hover{border-color:rgba(43,92,255,.45);color:var(--primary,#2b5cff);
  background:var(--primary-weak,#eef3ff)}

/* —— 结果区（表格） —— */
.zz-result{flex:1;overflow:auto;padding:10px 15px 14px;min-height:0}
.zz-result .zz-msg{font-size:12.8px;line-height:1.8;color:var(--text-2,#5a6478)}
.zz-result .zz-msg b{color:var(--text,#16203a)}
.zz-result .zz-sum{margin-bottom:9px;font-size:12.5px;color:var(--text-2,#5a6478);line-height:1.8}
.zz-result table{width:100%;border-collapse:collapse;font-size:12.2px}
.zz-result th{position:sticky;top:0;background:#f7f9ff;color:var(--text-2,#5a6478);font-weight:700;
  text-align:left;padding:7px 9px;border-bottom:1px solid var(--border,#e4e8f2);white-space:nowrap;z-index:1}
.zz-result td{padding:7px 9px;border-bottom:1px solid var(--line,#eef0f4);color:var(--text,#16203a);
  white-space:nowrap}
.zz-result tbody tr:nth-child(even){background:#fbfcff}
.zz-result tbody tr:hover{background:var(--primary-weak,#eef3ff)}
.zz-result .zz-num{text-align:right;font-variant-numeric:tabular-nums}
.zz-result .zz-neg{color:#e0484f;font-weight:700}
.zz-result .zz-empty{font-size:12.5px;color:var(--text-3,#8f97ab);padding:16px 0;text-align:center}

/* —— 输入区 —— */
.zz-input{display:flex;gap:7px;padding:11px 15px;border-top:1px solid var(--line,#eef0f4);background:#fcfdff}
.zz-input input{flex:1;min-width:0;border:1px solid var(--border,#e4e8f2);border-radius:10px;
  padding:8px 12px;font-size:12.8px;font-family:inherit;color:var(--text,#16203a);outline:none;
  transition:border-color .16s,box-shadow .16s}
.zz-input input:focus{border-color:rgba(43,92,255,.5);box-shadow:0 0 0 3px rgba(43,92,255,.1)}
.zz-input input::placeholder{color:var(--text-3,#8f97ab)}
.zz-input button{border:none;background:var(--primary,#2b5cff);color:#fff;font-size:12.5px;
  font-weight:700;border-radius:10px;padding:8px 16px;cursor:pointer;font-family:inherit;
  transition:background .16s;white-space:nowrap}
.zz-input button:hover{background:#1f4ae0}

/* —— 对话历史 —— */
.zz-hist{margin:2px 0 9px;display:flex;flex-direction:column;gap:7px}
.zz-hist .zz-h{font-size:12.4px;line-height:1.75;padding:7px 11px;border-radius:11px;max-width:88%}
.zz-hist .zz-h.me{align-self:flex-end;background:var(--primary-weak,#eef3ff);color:var(--primary,#2b5cff);
  border-bottom-right-radius:4px}
.zz-hist .zz-h.it{align-self:flex-start;background:#f5f7fc;color:var(--text,#16203a);
  border-bottom-left-radius:4px}

/* ============ 三、移动端适配 ============ */
@media(max-width:900px){
  #zzMascotRoot{right:12px;bottom:12px}
  .zz-panel{right:12px;bottom:12px;width:calc(100vw - 24px);max-height:min(70vh,520px)}
  .zz-body{width:88px}
  .zz-bubble{max-width:210px;font-size:12.2px}
  .zz-dot{width:46px;height:46px}
  .zz-dot svg{width:30px;height:30px}
}

/* ============ 四、无障碍：尊重"减少动效"偏好 ============ */
@media(prefers-reduced-motion:reduce){
  .zz-mascot *,.zz-body,.zz-bubble,.zz-dot{animation:none !important;transition:none !important}
}