.klause-fab{position:fixed;bottom:24px;right:24px;z-index:9998;width:60px;height:60px;border-radius:50%;background:linear-gradient(135deg,#006396,#2b7cb3);color:#fff;border:2px solid #006396;padding:0;overflow:hidden;cursor:pointer;box-shadow:0 4px 20px rgba(0,99,150,.35);display:flex;align-items:center;justify-content:center;transition:transform .3s,box-shadow .3s;font-size:28px}
.klause-fab:hover{transform:scale(1.1);box-shadow:0 6px 28px rgba(0,99,150,.5)}
.klause-fab .material-symbols-outlined{font-size:28px;font-variation-settings:'FILL' 1}
.klause-fab-img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.klause-avatar-img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.klause-fab-badge{position:absolute;top:-2px;right:-2px;width:16px;height:16px;background:#fe843c;border-radius:50%;border:2px solid #fff;animation:klause-pulse 2s infinite}
.klause-preview{position:fixed;bottom:92px;right:24px;z-index:9997;background:#fff;border-radius:16px 16px 4px 16px;padding:12px 18px;box-shadow:0 4px 24px rgba(0,0,0,.12);font-family:'Inter',sans-serif;font-size:14px;color:#1b1c1c;max-width:220px;opacity:0;transform:translateY(10px);transition:opacity .4s,transform .4s;pointer-events:none}
.klause-preview.show{opacity:1;transform:translateY(0);pointer-events:auto;cursor:pointer}
.klause-panel{position:fixed;bottom:24px;right:24px;z-index:9999;width:400px;height:550px;background:#fcf9f8;border-radius:24px;box-shadow:0 8px 40px rgba(0,0,0,.18);display:flex;flex-direction:column;overflow:hidden;opacity:0;transform:translateY(20px) scale(.95);transition:opacity .3s,transform .3s;pointer-events:none}
.klause-panel.open{opacity:1;transform:translateY(0) scale(1);pointer-events:auto}
.klause-header{background:linear-gradient(135deg,#006396,#2b7cb3);color:#fff;padding:16px 20px;display:flex;align-items:center;gap:12px;flex-shrink:0}
.klause-header-avatar{width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;font-size:22px}
.klause-header-info{flex:1}
.klause-header-info h3{font-family:'Plus Jakarta Sans',sans-serif;font-size:16px;font-weight:700;margin:0}
.klause-header-info p{font-size:11px;opacity:.8;margin:0}
.klause-close{background:none;border:none;color:#fff;cursor:pointer;font-size:20px;padding:4px;border-radius:8px;transition:background .2s;display:flex;align-items:center}
.klause-close:hover{background:rgba(255,255,255,.2)}
.klause-messages{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:12px;scroll-behavior:smooth}
.klause-msg{max-width:85%;padding:12px 16px;border-radius:16px;font-family:'Inter',sans-serif;font-size:13.5px;line-height:1.6;word-wrap:break-word}
.klause-msg.bot{align-self:flex-start;background:#e4e2e1;color:#1b1c1c;border-bottom-left-radius:4px}
.klause-msg.user{align-self:flex-end;background:#006396;color:#fff;border-bottom-right-radius:4px}
.klause-typing{align-self:flex-start;background:#e4e2e1;padding:12px 20px;border-radius:16px;border-bottom-left-radius:4px;display:flex;gap:5px;align-items:center}
.klause-typing span{width:7px;height:7px;background:#707880;border-radius:50%;animation:klause-bounce .6s infinite}
.klause-typing span:nth-child(2){animation-delay:.15s}
.klause-typing span:nth-child(3){animation-delay:.3s}
.klause-input-area{padding:12px 16px;border-top:1px solid #e4e2e1;display:flex;gap:8px;flex-shrink:0;background:#fff;border-radius:0 0 24px 24px}
.klause-input-area input{flex:1;border:none;background:#f0eded;border-radius:12px;padding:10px 16px;font-family:'Inter',sans-serif;font-size:14px;color:#1b1c1c;outline:none;transition:box-shadow .2s}
.klause-input-area input:focus{box-shadow:0 0 0 2px rgba(0,99,150,.2)}
.klause-input-area input::placeholder{color:#707880}
.klause-send{width:40px;height:40px;border-radius:12px;background:#006396;color:#fff;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s,transform .1s}
.klause-send:hover{background:#2b7cb3}
.klause-send:active{transform:scale(.93)}
.klause-send .material-symbols-outlined{font-size:20px}
.klause-quick-replies{display:flex;flex-wrap:wrap;gap:6px;padding:0 16px 12px}
.klause-quick-btn{background:#cce5ff;color:#006396;border:none;border-radius:20px;padding:6px 14px;font-family:'Inter',sans-serif;font-size:12px;font-weight:600;cursor:pointer;transition:background .2s}
.klause-quick-btn:hover{background:#92ccff}
.klause-pet-badge{margin:0 16px 8px;padding:8px 12px;background:#bcf297;color:#245107;border-radius:12px;font-family:'Inter',sans-serif;font-size:11px;font-weight:600;display:none;align-items:center;gap:6px}
.klause-pet-badge.show{display:flex}
@keyframes klause-bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@keyframes klause-pulse{0%,100%{opacity:1}50%{opacity:.4}}
@media(max-width:480px){.klause-panel{width:100%;height:100%;bottom:0;right:0;border-radius:0}.klause-fab{bottom:16px;right:16px}.klause-preview{bottom:84px;right:16px}}
