/* 简物仓 客服气泡 v5（黑猫「简」+ 极简对话版）· 暖米色 + 墨色 · 替换 /kf-bubble.css · 纯 CSS 动画，无依赖 */
.kf-root{--kf-ink:#1d1c1a;--kf-ink2:#2b2926;--kf-paper:#fffcf8;--kf-bg:#f4f1ec;--kf-line:#e3dcd3;--kf-muted:#7a746b;--kf-gold:#b08d57;--kf-on:#34c26b;
  font-family:"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;-webkit-tap-highlight-color:transparent}
.kf-root *{box-sizing:border-box}
.kf-root.is-hidden .kf-fab{opacity:0;pointer-events:none;transform:translateY(12px) scale(.9)}

/* —— 悬浮按钮：米白圆窗 + 小黑猫（一张图，一只猫）+ 在线绿点 + 「在线咨询 / 咨询顾问」小标签 —— */
.kf-fab{--kf-s:64px;position:fixed;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:40;display:flex;align-items:center;gap:0;
  height:var(--kf-s);padding:0;border:0;background:none;cursor:pointer;color:var(--kf-ink);transition:opacity .25s,transform .25s}
.kf-fab .kf-pill{height:34px;display:flex;align-items:center;margin-right:8px;padding:0 13px;border:1px solid var(--kf-line);
  border-radius:999px;background:rgba(255,252,248,.96);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  font-size:13px;font-weight:600;letter-spacing:.02em;white-space:nowrap;box-shadow:0 6px 18px -8px rgba(60,44,28,.28);
  max-width:120px;overflow:hidden;transition:max-width .45s cubic-bezier(.2,.8,.2,1),padding .45s,opacity .3s,margin .45s}
.kf-fab .kf-pill-d{display:none}
.kf-fab.is-compact .kf-pill{max-width:0;padding:0;margin:0;opacity:0;border:0}
.kf-fab .kf-mark{position:relative;flex:0 0 var(--kf-s);width:var(--kf-s);height:var(--kf-s);display:block;animation:kf-bob 3.4s ease-in-out infinite}
.kf-fab .kf-body{position:absolute;inset:0;display:block;transform-origin:50% 100%;animation:kf-breathe 3.4s ease-in-out infinite}
/* 圆窗（形状与帧里的猫下缘一致：上半圆、下缘略平），猫的耳朵可以探出圆窗上沿 */
.kf-fab .kf-disc{position:absolute;left:2.5%;right:2.5%;bottom:0;height:95%;border-radius:50% 50% 40% 40% / 50% 50% 50% 50%;
  background:radial-gradient(110% 110% at 32% 22%,#fffaf0 0%,#f5ead8 58%,#ead9bf 100%);
  box-shadow:0 0 0 2px rgba(255,252,246,.95),0 0 0 3px rgba(60,44,28,.10),0 10px 22px -8px rgba(40,28,16,.45)}
.kf-fab .kf-cat{position:absolute;left:0;top:0;width:100%;height:100%;display:block;-webkit-user-drag:none;user-select:none;pointer-events:none}
.kf-fab .kf-dot{position:absolute;top:9%;right:3%;width:13px;height:13px;border-radius:50%;background:var(--kf-on);border:2px solid #fffcf8;z-index:2}
.kf-fab .kf-dot::after{content:"";position:absolute;inset:-2px;border-radius:50%;background:var(--kf-on);opacity:.5;animation:kf-ping 2.8s ease-out infinite}
/* 首次进入的提示光环（只播两圈） */
.kf-fab .kf-ring{position:absolute;left:2.5%;right:2.5%;bottom:0;height:95%;border-radius:50%;pointer-events:none;opacity:0}
.kf-fab.is-hello .kf-ring{animation:kf-halo 1.2s ease-out 2}
@keyframes kf-halo{0%{opacity:.55;box-shadow:0 0 0 0 rgba(176,141,87,.55)}100%{opacity:0;box-shadow:0 0 0 18px rgba(176,141,87,0)}}
@keyframes kf-ping{0%{transform:scale(1);opacity:.5}70%,100%{transform:scale(2.2);opacity:0}}
@keyframes kf-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}
@keyframes kf-breathe{0%,100%{transform:scale(1,1)}50%{transform:scale(1.012,1.022)}}
/* 换表情时整只猫（连圆窗）轻轻「弹」一下 */
.kf-fab.is-pop .kf-body{animation:kf-pop .32s cubic-bezier(.3,1.6,.5,1) 1,kf-breathe 3.4s ease-in-out .32s infinite}
@keyframes kf-pop{0%{transform:scale(.95,1.04)}60%{transform:scale(1.03,.98)}100%{transform:scale(1)}}
/* 悬停 / 点按：大笑帧 + 小跳 */
.kf-fab.is-happy .kf-mark{animation:kf-hop .55s cubic-bezier(.3,1.6,.5,1) 1}
@keyframes kf-hop{0%{transform:translateY(0) scale(1,1)}25%{transform:translateY(1px) scale(1.06,.92)}55%{transform:translateY(-7px) scale(.97,1.04)}100%{transform:translateY(0) scale(1,1)}}
/* 桌面 / 平板：猫更大、更好找；「咨询顾问」标签常驻 */
@media (min-width:768px){
  .kf-fab{--kf-s:100px}
  .kf-fab .kf-dot{width:16px;height:16px;border-width:3px}
  .kf-fab .kf-pill,.kf-fab.is-compact .kf-pill{max-width:140px;height:38px;margin-right:10px;padding:0 16px;opacity:1;border:1px solid var(--kf-line);font-size:14px}
  .kf-fab .kf-pill-m{display:none}.kf-fab .kf-pill-d{display:inline}
  .kf-fab:hover .kf-pill{border-color:var(--kf-ink);background:#fffcf8}
}
@media (min-width:1200px){.kf-fab{--kf-s:112px}}

/* —— 弹窗：手机为底部卡片，桌面为右下浮层 —— */
.kf-scrim{position:fixed;inset:0;z-index:59;background:rgba(29,28,26,.18);opacity:0;pointer-events:none;transition:opacity .25s}
.kf-root.is-open .kf-scrim{opacity:1;pointer-events:auto}
.kf-panel{position:fixed;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));z-index:60;max-height:min(78vh,620px);overflow:auto;
  padding:16px 16px 14px;border:1px solid var(--kf-line);border-radius:22px;background:var(--kf-paper);color:var(--kf-ink);
  box-shadow:0 24px 60px -18px rgba(60,44,28,.38);transform:translateY(16px);opacity:0;pointer-events:none;transition:transform .3s cubic-bezier(.2,.8,.2,1),opacity .25s}
.kf-root.is-open .kf-panel{transform:none;opacity:1;pointer-events:auto}
.kf-head{display:flex;align-items:center;gap:10px;margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid var(--kf-line)}
.kf-av{position:relative;flex:0 0 40px;width:40px;height:40px;border-radius:50%;background:radial-gradient(110% 110% at 32% 22%,#fffaf0,#efe1ca);box-shadow:0 0 0 1px var(--kf-line)}
.kf-av img{width:40px;height:40px;border-radius:50%;display:block}
.kf-av i{position:absolute;right:-1px;bottom:0;width:10px;height:10px;border-radius:50%;background:var(--kf-on);border:2px solid var(--kf-paper)}
.kf-who{flex:1;min-width:0;line-height:1.3}.kf-who b{display:block;font-size:15px}.kf-who span{font-size:12px;color:var(--kf-muted)}
.kf-x{flex:0 0 36px;width:36px;height:36px;border:0;border-radius:50%;background:var(--kf-bg);color:var(--kf-ink);font-size:18px;line-height:1;cursor:pointer}
.kf-chat{display:flex;flex-direction:column;align-items:flex-start;gap:8px;margin:2px 0 16px}
.kf-msg{max-width:100%;margin:0;padding:10px 14px;border-radius:4px 16px 16px 16px;background:var(--kf-bg);font-size:14.5px;line-height:1.6;
  opacity:0;transform:translateY(6px)}
.kf-msg+.kf-msg{border-radius:16px}
.kf-msg{display:none}
.kf-msg.is-shown{display:block;animation:kf-in .32s cubic-bezier(.2,.8,.2,1) forwards}
@keyframes kf-in{to{opacity:1;transform:none}}
/* 「正在输入」三个点：每条自动消息前出现约 0.7 秒 */
.kf-typing{display:none;align-items:center;gap:4px;height:38px;padding:0 14px;border-radius:4px 16px 16px 16px;background:var(--kf-bg)}
.kf-typing.is-on{display:inline-flex;animation:kf-in .2s ease-out forwards;opacity:0;transform:translateY(4px)}
.kf-typing i{width:6px;height:6px;border-radius:50%;background:#9a9388;animation:kf-dots 1s ease-in-out infinite}
.kf-typing i:nth-child(2){animation-delay:.15s}.kf-typing i:nth-child(3){animation-delay:.3s}
@keyframes kf-dots{0%,60%,100%{transform:translateY(0);opacity:.45}30%{transform:translateY(-4px);opacity:1}}
.kf-go:active{transform:scale(.97);background:#3a3733}
.kf-go{transition:transform .12s,background .12s}
.kf-go{display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;border-radius:999px;background:var(--kf-ink);color:#f6efe2;text-decoration:none;font-size:15px;font-weight:600}
.kf-go svg{flex:0 0 auto}
.kf-qr{display:none;align-items:center;gap:12px;padding:10px;border:1px solid var(--kf-line);border-radius:14px;background:#fff}
.kf-qr img{width:112px;height:112px;display:block}.kf-qr b{display:block;font-size:14px}.kf-qr span{font-size:12px;color:var(--kf-muted)}
@media (min-width:861px){
  .kf-scrim{display:none}
  .kf-panel{left:auto;right:18px;bottom:calc(136px + env(safe-area-inset-bottom));width:360px;transform-origin:100% 100%}
  .kf-fab{right:18px;bottom:18px}
}
@media (min-width:861px) and (hover:hover){.kf-go{display:none}.kf-qr{display:flex}}
@media (prefers-reduced-motion:reduce){.kf-fab .kf-dot::after,.kf-fab .kf-mark,.kf-fab .kf-body,.kf-fab .kf-ring{animation:none!important}.kf-panel,.kf-fab,.kf-fab .kf-pill{transition:none}.kf-msg.is-shown{animation:none;opacity:1;transform:none}.kf-typing i{animation:none}}