/* 阿半悬浮挂件 */
#aban-fab{position:fixed;touch-action:none;right:16px;bottom:96px;width:124px;height:124px;border-radius:50%;
background:rgba(20,18,34,.85);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
border:1px solid rgba(255,255,255,.16);box-shadow:0 6px 24px rgba(0,0,0,.45);
display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:9999;
animation:aban-float 3.6s ease-in-out infinite}
#aban-fab svg{width:96px;height:96px}
@keyframes aban-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
#aban-fab.thinking{animation:none}
#aban-fab.thinking .aban-face-eyes{display:none}
#aban-fab .aban-fab-spin{display:none;position:absolute;inset:6px;border-radius:50%;
border:3px solid transparent;border-top-color:#EDB33F;animation:aban-spin .9s linear infinite}
#aban-fab.thinking .aban-fab-spin{display:block}
@keyframes aban-spin{to{transform:rotate(360deg)}}
#aban-fab.busy{animation:aban-shake .5s ease-in-out}
@keyframes aban-shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
#aban-panel{position:fixed;z-index:10000;left:0;right:0;bottom:0;max-height:72vh;
background:rgba(16,14,28,.96);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
border-top:1px solid rgba(255,255,255,.12);border-radius:20px 20px 0 0;
display:flex;flex-direction:column;overflow:hidden;transform:translateY(calc(100% + 190px));transition:transform .28s ease}
#aban-panel.open{transform:translateY(0)}
@media(min-width:768px){#aban-panel{left:auto;right:20px;bottom:170px;width:380px;max-height:560px;border:1px solid rgba(255,255,255,.12);border-radius:20px}}
#aban-panel-head{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid rgba(255,255,255,.08)}
#aban-panel-head .t{font-size:16px;font-weight:600}
#aban-panel-status{font-size:12px;color:#a49ec4;flex:1}
#aban-close{background:none;border:none;color:#a49ec4;font-size:18px;cursor:pointer;padding:4px 8px}
#aban-char{padding:10px 0 2px;text-align:center}
#aban-char svg{width:104px;height:auto;animation:aban-float 4s ease-in-out infinite}
#aban-char .aban-eyes{animation:aban-drift 7s ease-in-out infinite}
@keyframes aban-drift{0%,100%{transform:translateX(0)}30%{transform:translateX(3px)}60%{transform:translateX(-3px)}}
#aban-char.blink .aban-eyes{animation:aban-blink .28s ease-in-out}
@keyframes aban-blink{0%,100%{transform:scaleY(1)}50%{transform:scaleY(.08)}}
#aban-char .aban-loader{display:none}
#aban-panel.thinking #aban-char .aban-eye-r{display:none}
#aban-panel.thinking #aban-char .aban-loader{display:block}
#aban-msgs{flex:1;overflow-y:auto;padding:12px 16px;display:flex;flex-direction:column;gap:8px;min-height:120px}
#aban-msgs .m{max-width:85%;padding:9px 13px;border-radius:14px;font-size:14px;line-height:1.55;word-break:break-word}
#aban-msgs .m.u{align-self:flex-end;background:#8E7CC3;color:#fff;border-bottom-right-radius:5px}
#aban-msgs .m.a{align-self:flex-start;background:rgba(255,255,255,.09);border-bottom-left-radius:5px}
#aban-inputbar{display:flex;gap:8px;padding:12px 16px;border-top:1px solid rgba(255,255,255,.08)}
#aban-q{flex:1;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);border-radius:999px;padding:10px 16px;color:#fff;font-size:14px;outline:none}
#aban-q::placeholder{color:#6f6a8c}
#aban-send{background:#8E7CC3;border:none;color:#fff;border-radius:999px;padding:10px 18px;font-size:14px;cursor:pointer}
#aban-send:disabled{opacity:.5}
/* v3: 表情切换 + pinned 状态 */
#aban-fab.pinned{animation:none}
#aban-fab .expr,#aban-char .expr{display:none}
#aban-fab.expr-happy .expr-happy,#aban-fab.expr-busy .expr-busy,#aban-fab.expr-thinking .expr-thinking{display:block}
#aban-char.expr-happy .expr-happy,#aban-char.expr-busy .expr-busy,#aban-char.expr-thinking .expr-thinking{display:block}
#aban-fab.expr-happy .mouth-base,#aban-fab.expr-happy .aban-face-eyes,
#aban-fab.expr-busy .mouth-base,#aban-fab.expr-busy .aban-face-eyes,
#aban-fab.expr-thinking .mouth-base,#aban-fab.expr-thinking .aban-face-eyes{display:none}
#aban-char.expr-happy .mouth-base,#aban-char.expr-happy .aban-eyes,
#aban-char.expr-busy .mouth-base,#aban-char.expr-busy .aban-eyes,
#aban-char.expr-thinking .mouth-base{display:none}
#aban-char.expr-busy{animation:aban-shake .6s ease-in-out infinite}
#aban-fab.busy.pinned{animation:aban-shake .5s ease-in-out}


/* v4: a quiet cosmic halo helps the idle companion read as an interactive character */
#aban-fab{isolation:isolate;box-shadow:0 6px 24px rgba(0,0,0,.45),0 0 0 1px rgba(219,204,255,.18)}
#aban-fab::before{content:"";position:absolute;inset:-18px;z-index:-1;border-radius:50%;pointer-events:none;
background:radial-gradient(circle,rgba(142,124,195,.42) 0%,rgba(112,91,160,.2) 48%,rgba(237,179,63,.12) 66%,transparent 76%);
filter:blur(7px);opacity:.78;animation:aban-aura 4.8s ease-in-out infinite}
#aban-fab::after{content:"";position:absolute;inset:-4px;z-index:2;border:1px solid rgba(219,204,255,.42);border-radius:50%;pointer-events:none;
box-shadow:0 0 12px rgba(142,124,195,.28),inset 0 0 8px rgba(237,179,63,.1)}
#aban-fab video,#aban-fab>svg{position:relative;z-index:1}
#aban-fab .aban-fab-spin{z-index:3}
#aban-fab:hover::after{border-color:rgba(237,179,63,.72);box-shadow:0 0 16px rgba(237,179,63,.34),inset 0 0 8px rgba(237,179,63,.14)}
@keyframes aban-aura{0%,100%{opacity:.58;transform:scale(.97)}50%{opacity:.9;transform:scale(1.04)}}
@media(prefers-reduced-motion:reduce){#aban-fab::before{animation:none;opacity:.68}}


/* v5: focused chat layout with a taller transcript and clearer controls */
#aban-panel{height:min(72vh,620px);max-height:72vh;border:1px solid rgba(219,204,255,.14);border-radius:24px 24px 0 0;
background:linear-gradient(155deg,rgba(25,21,43,.98),rgba(12,11,23,.985));box-shadow:0 24px 80px rgba(0,0,0,.48)}
#aban-panel-head{padding:13px 15px;background:linear-gradient(110deg,rgba(142,124,195,.12),rgba(255,255,255,.015));border-bottom-color:rgba(219,204,255,.12)}
#aban-panel-head .t{font-size:17px;letter-spacing:.2px}
#aban-panel-status{display:flex;align-items:center;gap:7px;color:rgba(230,224,248,.64)}
#aban-panel-status::before{content:"";width:6px;height:6px;flex:0 0 6px;border-radius:50%;background:#edb33f;box-shadow:0 0 9px rgba(237,179,63,.7)}
#aban-close{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:12px;background:rgba(255,255,255,.055);transition:background .18s,color .18s,transform .18s}
#aban-close:hover{background:rgba(255,255,255,.12);color:#fff;transform:rotate(90deg)}
#aban-char{padding:7px 0 10px;background:radial-gradient(ellipse 170px 100px at 50% 48%,rgba(142,124,195,.15),transparent 76%)}
#aban-char video{filter:drop-shadow(0 8px 18px rgba(142,124,195,.3))}
#aban-msgs{min-height:0;padding:14px 16px;gap:10px;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:rgba(219,204,255,.25) transparent}
#aban-msgs .m{max-width:88%;padding:11px 14px;border-radius:16px;font-size:14px;line-height:1.62}
#aban-msgs .m.u{background:linear-gradient(135deg,#9d87d3,#7968b2);border:1px solid rgba(231,220,255,.2);box-shadow:0 5px 18px rgba(96,75,145,.2);border-bottom-right-radius:6px}
#aban-msgs .m.a{background:rgba(255,255,255,.065);border:1px solid rgba(255,255,255,.075);border-bottom-left-radius:6px}
#aban-inputbar{gap:10px;padding:12px 14px calc(12px + env(safe-area-inset-bottom,0px));background:rgba(8,7,17,.38);border-top-color:rgba(219,204,255,.12)}
#aban-q{min-width:0;min-height:46px;padding:11px 16px;background:rgba(255,255,255,.065);border-color:rgba(219,204,255,.16);border-radius:16px;transition:border-color .18s,background .18s,box-shadow .18s}
#aban-q:focus{border-color:rgba(178,157,232,.72);background:rgba(255,255,255,.09);box-shadow:0 0 0 3px rgba(142,124,195,.16)}
#aban-send{min-height:46px;padding:0 20px;border:1px solid rgba(231,220,255,.18);background:linear-gradient(135deg,#9d87d3,#7968b2);font-weight:650;transition:filter .18s,transform .18s}
#aban-send:hover{filter:brightness(1.1)}
#aban-send:active{transform:scale(.96)}
body:has(#aban-panel.open) #aban-fab{visibility:hidden;opacity:0;pointer-events:none}
@media(min-width:768px){
  #aban-panel{right:20px;bottom:calc(124px + 96px + 12px);width:min(420px,calc(100vw - 40px));height:min(620px,calc(100vh - 256px));max-height:calc(100vh - 256px);border-radius:24px}
  #aban-panel-head{padding:14px 16px}
}
@media(prefers-reduced-motion:reduce){#aban-close,#aban-send,#aban-q{transition:none}#aban-close:hover{transform:none}}


/* v6: device-specific companion and chat layouts */
@media(max-width:767px){
  #aban-fab{width:72px;height:72px;right:12px;bottom:96px}
  #aban-fab svg{width:56px;height:56px}
  #aban-fab::before{inset:-12px}
  #aban-fab::after{inset:-3px}
  #aban-panel{height:min(78vh,660px);max-height:78vh;border-radius:24px 24px 0 0}
  #aban-panel-head{padding:12px 14px}
  #aban-char{padding:4px 0 8px}
  #aban-char video{width:92px!important;height:92px!important}
  #aban-msgs{padding:11px 14px}
  #aban-inputbar{padding:10px 12px calc(10px + env(safe-area-inset-bottom,0px))}
}
@supports(height:78dvh){
  @media(max-width:767px){#aban-panel{height:min(78dvh,660px);max-height:78dvh}}
}


/* v7: crop baked captions and blend the character badge into the chat surface */
#aban-char{position:relative;isolation:isolate}
#aban-char::before{content:"";position:absolute;z-index:0;left:50%;top:50%;width:116px;height:116px;transform:translate(-50%,-50%);border-radius:50%;
background:radial-gradient(circle at 38% 32%,rgba(237,179,63,.14),rgba(142,124,195,.2) 48%,rgba(25,21,43,.15) 72%);border:1px solid rgba(219,204,255,.18);
box-shadow:0 0 28px rgba(142,124,195,.18);pointer-events:none}
#aban-char video{position:relative;z-index:1;width:104px!important;height:104px!important;object-fit:cover!important;object-position:center 50%;border-radius:50%!important;
mix-blend-mode:screen;filter:drop-shadow(0 6px 14px rgba(142,124,195,.28))}
@media(max-width:767px){#aban-char::before{width:102px;height:102px}#aban-char video{width:92px!important;height:92px!important}}

/* v11: restrained one-shot gestures layered over the existing character clips */
#aban-fab .aban-heart-pop,#aban-char .aban-heart-pop{position:absolute;z-index:5;pointer-events:none;left:50%;top:9%;opacity:0;
font-family:system-ui,sans-serif;font-size:30px;line-height:1;color:#f4a3cc;text-shadow:0 2px 14px rgba(244,163,204,.55);transform:translate(-50%,8px) scale(.65)}
#aban-fab .aban-heart-pop{font-size:25px;top:10%}
#aban-char.action-nod video,#aban-fab.action-nod video{animation:aban-gesture-nod 1.5s cubic-bezier(.3,.7,.25,1) both}
#aban-char.action-tilt video,#aban-fab.action-tilt video{animation:aban-gesture-tilt 1.6s ease-in-out both}
#aban-char.action-heart video,#aban-fab.action-heart video{animation:aban-gesture-heart 1.55s cubic-bezier(.22,.75,.3,1) both}
#aban-char.action-wake video,#aban-fab.action-wake video{animation:aban-gesture-wake 1.6s ease-out both}
#aban-char.action-heart .aban-heart-pop,#aban-fab.action-heart .aban-heart-pop,
#aban-char.action-tilt .aban-heart-pop,#aban-fab.action-tilt .aban-heart-pop{animation:aban-heart-rise 1.5s ease-out both}
#aban-char.action-tilt .aban-heart-pop,#aban-fab.action-tilt .aban-heart-pop{color:#c5b7ed;text-shadow:0 2px 12px rgba(197,183,237,.5)}
@keyframes aban-gesture-nod{0%,100%{transform:translateY(0) rotate(0)}28%{transform:translateY(5px) rotate(-2deg)}55%{transform:translateY(-1px) rotate(1deg)}75%{transform:translateY(2px) rotate(0)}}
@keyframes aban-gesture-tilt{0%,100%{transform:rotate(0)}35%,70%{transform:rotate(-7deg) translateY(-2px)}}
@keyframes aban-gesture-heart{0%,100%{transform:translateY(0) scale(1)}35%{transform:translateY(-5px) scale(1.045)}65%{transform:translateY(1px) scale(1.01)}}
@keyframes aban-gesture-wake{0%{transform:translateY(8px) scale(.96);opacity:.72}55%{transform:translateY(-3px) scale(1.02)}100%{transform:translateY(0) scale(1);opacity:1}}
@keyframes aban-heart-rise{0%{opacity:0;transform:translate(-50%,10px) scale(.55)}22%{opacity:1;transform:translate(-50%,0) scale(1)}75%{opacity:.9;transform:translate(-50%,-17px) scale(.92)}100%{opacity:0;transform:translate(-50%,-25px) scale(.72)}}
@media(prefers-reduced-motion:reduce){#aban-char.action-nod video,#aban-fab.action-nod video,#aban-char.action-tilt video,#aban-fab.action-tilt video,#aban-char.action-heart video,#aban-fab.action-heart video,#aban-char.action-wake video,#aban-fab.action-wake video,#aban-char.action-sad video,#aban-fab.action-sad video,#aban-char .aban-heart-pop,#aban-fab .aban-heart-pop{animation:none!important}}

#aban-char.action-sad video,#aban-fab.action-sad video{animation:aban-gesture-sad 1.6s ease-in-out both}
#aban-char.action-sad .aban-heart-pop,#aban-fab.action-sad .aban-heart-pop{animation:aban-sad-tear 1.6s ease-in both;color:#a9c8f4;text-shadow:0 2px 12px rgba(169,200,244,.55)}
@keyframes aban-gesture-sad{0%,100%{transform:translateY(0) rotate(0) scale(1)}35%,70%{transform:translateY(5px) rotate(-4deg) scale(.97)}}
@keyframes aban-sad-tear{0%{opacity:0;transform:translate(-50%,0) scale(.7)}25%{opacity:1}75%{opacity:.9;transform:translate(-42%,15px) scale(.85)}100%{opacity:0;transform:translate(-42%,20px) scale(.7)}}