/* =====================================================================
   小账喵 AI 助手角色系统 v1.0 —— 样式
   设计约束：
   - 角色本体默认隐藏；右缘「探头浮标」为悬浮入口，点击后小猫滑入 + 面板展开
   - 展开后角色：position:fixed; right:24px; bottom:100px; z-index:999
   - 尺寸：手机 64-80px（默认 76）/ PC 80-96px（默认 88），断点 768px
   - 动画：idle 呼吸 scale 1→1.05→1 周期 3s；drowsy/sleep 慢呼吸；动作切换用弹入
   - 只消费主题 token（--card-bg/--text-*），不承担任何主题装饰职责
   ===================================================================== */

.bkfa-root{
  --bkfa-size:76px;               /* 手机默认 76px，落在 64-80 区间 */
  position:fixed;
  right:0;                        /* root 只做定位容器，本体各有定位 */
  bottom:0;
  z-index:999;
  font-family:inherit;
  pointer-events:none;            /* 让未遮挡区域可点，子元素单独恢复 */
  -webkit-tap-highlight-color:transparent;
}
.bkfa-root .bkfa-peek,.bkfa-root .bkfa-cat,.bkfa-root .bkfa-panel{pointer-events:auto}
@media (min-width:768px){
  .bkfa-root{--bkfa-size:88px}    /* PC 88px，落在 80-96 区间 */
}

/* ============ 探头浮标（默认态唯一的可见元素） ============ */
.bkfa-peek{
  position:fixed;
  right:0;
  bottom:120px;
  width:36px;
  height:76px;
  padding:0;
  border:0;
  border-radius:18px 0 0 18px;
  background:var(--card-bg,#fff);
  box-shadow:0 6px 18px rgba(28,54,58,.22),inset 0 0 0 1px var(--border-soft,rgba(0,0,0,.06));
  cursor:pointer;
  overflow:visible;
  transition:transform .22s ease,opacity .22s ease,box-shadow .2s ease;
}
.bkfa-peek:hover{transform:translateX(-3px);box-shadow:0 10px 24px rgba(28,54,58,.28),inset 0 0 0 1px var(--border-soft,rgba(0,0,0,.06))}
.bkfa-peek:active{transform:translateX(-1px) scale(.97)}
.bkfa-peek:focus-visible{outline:3px solid var(--primary,#5fb9a6);outline-offset:2px}
.bkfa-peek-face{
  position:absolute;
  left:3px;top:10px;
  width:30px;height:56px;
  border-radius:14px;
  background-color:transparent;
  background-image:url('./assets/assistant/xiaozhangmao/master/face.webp');
  background-repeat:no-repeat;
  background-position:center 12%;   /* 只露出猫头：探头效果 */
  background-size:170%;
}
/* 探头浮标的待确认角标 */
.bkfa-cat-badge{
  position:absolute;
  top:-4px;left:-6px;
  min-width:19px;height:19px;
  padding:0 5px;
  border-radius:10px;
  background:var(--danger,#d96858);
  color:#fff;
  font-size:11px;line-height:19px;font-weight:700;text-align:center;
  box-shadow:0 2px 6px rgba(0,0,0,.18);
}
.bkfa-cat-badge[hidden]{display:none}

/* ============ 角色本体（展开后出现，默认藏在屏外） ============ */
.bkfa-cat{
  position:fixed;
  right:24px;
  bottom:100px;
  display:block;
  width:var(--bkfa-size);
  height:var(--bkfa-size);
  padding:0;
  border:0;
  border-radius:50%;
  background:var(--card-bg,#fff);
  box-shadow:0 10px 26px rgba(28,54,58,.20),0 2px 8px rgba(28,54,58,.10);
  cursor:pointer;
  opacity:0;
  transform:translateX(130%);
  transition:transform .34s cubic-bezier(.3,1.4,.5,1),opacity .26s ease,box-shadow .18s ease;
}
.bkfa-root.expanded .bkfa-cat{opacity:1;transform:none}
.bkfa-root.expanded .bkfa-cat:hover{transform:translateY(-2px);box-shadow:0 14px 32px rgba(28,54,58,.24),0 3px 10px rgba(28,54,58,.12)}
.bkfa-root.expanded .bkfa-cat:active{transform:scale(.94)}
.bkfa-root.expanded .bkfa-cat:focus-visible{outline:3px solid var(--primary,#5fb9a6);outline-offset:3px}
/* 展开时探头浮标退场 */
.bkfa-root.expanded .bkfa-peek{opacity:0;transform:translateX(110%);pointer-events:none}

.bkfa-cat-img{
  display:block;
  width:100%;
  height:100%;
  border-radius:50%;
  background-color:transparent;
  background-image:url('./assets/assistant/xiaozhangmao/actions/idle.webp');
  background-repeat:no-repeat;
  background-position:center;
  background-size:100% 100%;
  will-change:transform;
}
/* 动作分层动画：idle 呼吸 / sleep 慢呼吸 / 其余保持静止帧（弹入动画代替） */
.bkfa-root[data-action="idle"] .bkfa-cat-img{background-size:112%;background-position:center 46%;animation:bkfa-breathe 3s ease-in-out infinite}
.bkfa-root[data-action="drowsy"] .bkfa-cat-img,.bkfa-root[data-action="sleep"] .bkfa-cat-img{background-position:center 55%;animation:bkfa-breathe-slow 4.2s ease-in-out infinite}
.bkfa-root[data-action="thinking"] .bkfa-cat-img{background-size:112%;background-position:center 42%}
@keyframes bkfa-breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.05)}}
@keyframes bkfa-breathe-slow{0%,100%{transform:scale(1)}50%{transform:scale(1.02)}}
/* 动作切换时的弹入 */
.bkfa-root.pop .bkfa-cat-img{animation:bkfa-pop .38s cubic-bezier(.34,1.56,.64,1) 1}
@keyframes bkfa-pop{0%{transform:scale(.72)}100%{transform:scale(1)}}

/* ============ 主题联动配饰（V2.0：8 套，同一只猫只换 idle 图） ============ */
.bkfa-root[data-variant="daily"]    .bkfa-panel-avatar{background-image:url('./assets/assistant/xiaozhangmao/themes/daily/idle.webp')}
.bkfa-root[data-variant="analyst"]  .bkfa-panel-avatar{background-image:url('./assets/assistant/xiaozhangmao/themes/analyst/idle.webp')}
.bkfa-root[data-variant="travel"]   .bkfa-panel-avatar{background-image:url('./assets/assistant/xiaozhangmao/themes/travel/idle.webp')}
.bkfa-root[data-variant="cozy"]     .bkfa-panel-avatar{background-image:url('./assets/assistant/xiaozhangmao/themes/cozy/idle.webp')}
.bkfa-root[data-variant="oriental"] .bkfa-panel-avatar{background-image:url('./assets/assistant/xiaozhangmao/themes/oriental/idle.webp')}
.bkfa-root[data-variant="tech"]     .bkfa-panel-avatar{background-image:url('./assets/assistant/xiaozhangmao/themes/tech/idle.webp')}
.bkfa-root[data-variant="reminder"] .bkfa-panel-avatar{background-image:url('./assets/assistant/xiaozhangmao/themes/reminder/idle.webp')}
.bkfa-root[data-variant="saving"]   .bkfa-panel-avatar{background-image:url('./assets/assistant/xiaozhangmao/themes/saving/idle.webp')}

/* ============ 助手面板（从右下角展开） ============ */
.bkfa-panel{
  position:fixed;
  right:20px;
  bottom:calc(100px + var(--bkfa-size) + 14px);
  width:min(320px,calc(100vw - 40px));
  padding:14px 14px 12px;
  border-radius:22px;
  background:var(--card-bg,#fff);
  border:1px solid var(--border-soft,rgba(0,0,0,.08));
  box-shadow:0 24px 60px rgba(20,46,50,.24),0 4px 14px rgba(20,46,50,.10);
  transform-origin:100% 100%;
  opacity:0;
  transform:translateY(16px) scale(.9);
  pointer-events:none;
  transition:transform .3s cubic-bezier(.34,1.56,.64,1),opacity .18s ease;
  z-index:999;
}
.bkfa-root.expanded .bkfa-panel{opacity:1;transform:none;pointer-events:auto}

.bkfa-panel-head{display:flex;align-items:center;gap:10px}
.bkfa-panel-avatar{
  flex:0 0 auto;
  width:54px;height:54px;
  border-radius:50%;
  background-color:var(--primary-faint,rgba(0,0,0,.05));
  background-repeat:no-repeat;
  background-position:center 40%;
  background-size:112%;
  box-shadow:inset 0 0 0 2px var(--border-soft,rgba(0,0,0,.06));
}
.bkfa-panel-hi{flex:1;min-width:0}
.bkfa-panel-hi strong{display:block;font-size:14px;line-height:1.35;color:var(--text-primary,#213338)}
.bkfa-panel-hi span{display:block;margin-top:2px;font-size:11px;color:var(--text-tertiary,#93a9ac)}
.bkfa-panel-close{
  flex:0 0 auto;
  width:28px;height:28px;
  border:0;border-radius:50%;
  background:var(--primary-faint,rgba(0,0,0,.06));
  color:var(--text-secondary,#4d6d72);
  font-size:15px;line-height:1;cursor:pointer;
}
.bkfa-panel-close:hover{background:var(--primary-soft,rgba(0,0,0,.1))}

.bkfa-panel-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
.bkfa-stat{padding:9px 12px;border-radius:14px;background:var(--card-bg-soft,rgba(0,0,0,.04))}
.bkfa-stat .k{display:block;font-size:11px;color:var(--text-tertiary,#93a9ac)}
.bkfa-stat strong{display:block;margin-top:2px;font-size:16px;letter-spacing:.01em;color:var(--text-primary,#213338);font-variant-numeric:tabular-nums}
.bkfa-stat.attention strong{color:var(--warning,#c48a32)}

.bkfa-panel-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px}
.bkfa-panel-actions button{
  padding:9px 4px;
  border:1px solid var(--border-soft,rgba(0,0,0,.08));
  border-radius:12px;
  background:var(--card-bg,#fff);
  color:var(--text-primary,#213338);
  font-size:12.5px;cursor:pointer;
  transition:background .15s ease,transform .12s ease;
}
.bkfa-panel-actions button:hover{background:var(--primary-faint,rgba(0,0,0,.05))}
.bkfa-panel-actions button:active{transform:scale(.96)}
.bkfa-panel-actions button.primary{background:var(--primary,#5fb9a6);border-color:transparent;color:#fff;font-weight:600}
.bkfa-panel-actions button.primary:hover{background:var(--primary-deep,#4aa691)}

@media (prefers-reduced-motion:reduce){
  .bkfa-root[data-action="idle"] .bkfa-cat-img,
   .bkfa-root[data-action="drowsy"] .bkfa-cat-img,.bkfa-root[data-action="sleep"] .bkfa-cat-img{animation:none}
  .bkfa-cat,.bkfa-peek,.bkfa-panel{transition:opacity .15s ease;transform:none}
}
