/* "熊珊的 Agent" chat panel and launcher */
.agent-launcher{position:fixed;right:68px;bottom:18px;z-index:40;display:flex;align-items:center;gap:10px;padding:8px 16px 8px 8px;border-radius:40px;background:var(--ink);color:var(--paper);font-size:13px;font-weight:700;box-shadow:0 10px 30px #1f242030;transition:transform .3s var(--ease),opacity .3s}
.agent-launcher:hover{transform:translateY(-3px)}
.agent-launcher .bot{width:30px;height:30px;border-radius:50%;background:#f3f5f1;display:grid;place-items:center;position:relative}
.agent-launcher .bot::before{content:'';width:18px;height:9px;border-radius:4px;background:#1f2f8a;box-shadow:inset -5px 0 0 -2px #1f2f8a}
.agent-launcher .bot::after{content:'';position:absolute;top:-4px;right:3px;width:7px;height:7px;border-radius:50%;background:var(--orange);animation:agent-ping 2.4s infinite}
@keyframes agent-ping{0%,70%,100%{transform:scale(1)}80%{transform:scale(1.5)}}
.agent-open .agent-launcher{opacity:0;pointer-events:none}

.agent-chat{position:fixed;right:20px;bottom:20px;z-index:60;width:390px;max-width:calc(100vw - 32px);height:min(620px,calc(100svh - 40px));display:flex;flex-direction:column;background:#f8faf5;border:1px solid #d6dcd2;border-radius:22px;box-shadow:0 30px 80px #1f242038;overflow:hidden;opacity:0;transform:translateY(16px) scale(.98);transform-origin:bottom right;transition:opacity .25s var(--ease),transform .25s var(--ease)}
.agent-chat.shown{opacity:1;transform:none}
.agent-head{display:flex;align-items:center;gap:12px;padding:14px 14px 14px 16px;border-bottom:1px solid #dfe5d9;background:#eef0ea}
.agent-head .avatar{width:38px;height:38px;border-radius:12px;background:#f3f5f1;border:1px solid #d6dcd2;display:grid;place-items:center;flex:none}
.agent-head .avatar span{width:24px;height:11px;border-radius:5px;background:#1f2f8a;position:relative}
.agent-head .avatar span::before,.agent-head .avatar span::after{content:'';position:absolute;top:3px;width:5px;height:5px;border-radius:1px;background:#9fe3ff}
.agent-head .avatar span::before{left:4px}.agent-head .avatar span::after{right:4px}
.agent-head .t{flex:1;min-width:0}
.agent-head strong{display:block;font-size:15px}
.agent-head small{display:block;font-size:11px;color:#6f776f;margin-top:2px}
.agent-head .close{position:static;flex:none}
.agent-log{flex:1;overflow-y:auto;padding:18px 16px;display:flex;flex-direction:column;gap:10px;overscroll-behavior:contain}
.msg{display:flex}
.msg .bubble{max-width:86%;padding:10px 13px;border-radius:16px;font-size:13.5px;line-height:1.75;overflow-wrap:anywhere}
.from-agent .bubble{background:#fff;border:1px solid #e3e8dd;border-bottom-left-radius:5px;color:var(--ink)}
.from-user{justify-content:flex-end}
.from-user .bubble{background:var(--blue);color:#fff;border-bottom-right-radius:5px}
.bubble .li{display:block;padding-left:14px;position:relative}
.bubble .li::before{content:'';position:absolute;left:2px;top:.75em;width:5px;height:5px;border-radius:50%;background:var(--orange)}
.typing .bubble{min-width:58px;min-height:40px;position:relative}
.typing .bubble::after{content:'';position:absolute;left:14px;top:17px;width:6px;height:6px;border-radius:50%;background:#9aa294;box-shadow:11px 0 #9aa294,22px 0 #9aa294;animation:agent-dots 1s infinite}
@keyframes agent-dots{50%{opacity:.35}}
.suggest{display:flex;flex-wrap:wrap;gap:7px;margin-top:2px}
.suggest button{font-size:12px;padding:8px 12px;border-radius:20px;background:#fff;border:1px solid #d2d9cc;color:var(--blue);text-align:left;transition:background .2s}
.suggest button:hover{background:#e3e8ff}
.contact-card{background:#fff;border:1px solid #f0c6b5;border-radius:16px;padding:14px;display:grid;gap:8px}
.contact-card .cc-title{margin:0;font-weight:700;font-size:14px}
.contact-card .cc-sub,.contact-card .cc-note{margin:0;font-size:11.5px;color:#6f776f;line-height:1.6}
.contact-card label{margin:0;font-size:11.5px;color:#6d756c}
.contact-card label b{color:var(--orange)}
.contact-card input,.contact-card textarea{margin-top:4px;padding:8px 10px;font-size:13px;border-radius:9px}
.contact-card .hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.contact-card .pill{justify-self:start;padding:11px 18px;font-size:13px}
.contact-card .pill:disabled{opacity:.6}
.contact-card .cc-status{margin:0;font-size:12px;color:#c4532c;min-height:1em}
.contact-card .cc-done{margin:0;font-size:13.5px;color:var(--blue);font-weight:700}
.agent-foot{border-top:1px solid #dfe5d9;padding:10px 12px 12px;background:#f8faf5}
.agent-form{display:flex;gap:8px;align-items:flex-end}
.agent-form textarea{margin:0;flex:1;resize:none;min-height:42px;max-height:120px;border-radius:14px;padding:11px 13px;font-size:13.5px;line-height:1.5}
.agent-form button{flex:none;width:42px;height:42px;border-radius:50%;background:var(--blue);color:#fff;font-size:18px;display:grid;place-items:center}
.agent-form button:disabled{opacity:.45}
.agent-meta{display:flex;justify-content:space-between;gap:10px;margin-top:8px;font-size:10.5px;color:#8b9488}
.agent-meta button{background:none;padding:0;font-size:11px;color:var(--orange);font-weight:700;white-space:nowrap}
@media(max-width:760px){
  .agent-launcher{right:56px;bottom:14px;padding:6px 13px 6px 6px;font-size:12px}
  .agent-chat{right:8px;left:8px;bottom:8px;width:auto;max-width:none;height:min(620px,calc(100svh - 16px));border-radius:20px}
}
@media(prefers-reduced-motion:reduce){.agent-chat,.agent-launcher{transition:none}.agent-launcher .bot::after{animation:none}}
.agent-form textarea:focus-visible{outline:2px solid var(--blue);outline-offset:1px}

/* Launcher sits in the corner; it only moves left when the edit button is shown (?edit). On phones it shrinks to an icon once the visitor scrolls past the hero. */
.agent-launcher{right:20px}
.edit-mode .agent-launcher{right:68px}
@media(max-width:760px){
  .agent-launcher{right:14px}
  .edit-mode .agent-launcher{right:56px}
  .scrolled .agent-launcher{padding:6px;gap:0}
  .scrolled .agent-launcher .lbl{display:none}
}

/* v2: match the product-style page (cool greys, the S mark as avatar, blue for actions) */
.agent-chat{background:#fff;border-color:#e3e6ee;border-radius:20px;box-shadow:0 40px 100px -30px rgb(19 23 34 / .4)}
.agent-head{background:#fff;border-bottom-color:#eef0f4}
.agent-head .avatar{background:#fff;border-color:#e6e8ee;border-radius:12px}
.agent-head .avatar svg{width:24px;height:24px}
.agent-head .avatar path{fill:none;stroke-width:7}
.agent-head small{color:#5f6779}
.agent-log{background:#f6f7fa}
.from-agent .bubble{border-color:#e6e8ee}
.bubble .li::before{background:var(--blue)}
.typing .bubble::after{background:#9aa3b7;box-shadow:11px 0 #9aa3b7,22px 0 #9aa3b7}
.suggest button{border-color:#dbe1ff;background:#eef1ff}
.suggest button:hover{background:#e2e7ff}
.contact-card{border-color:#e6e8ee}
.contact-card .cc-sub,.contact-card .cc-note,.contact-card label{color:#5f6779}
.contact-card label b{color:var(--orange-text)}
.contact-card input,.contact-card textarea{display:block;width:100%;border:1px solid #dfe3eb;background:#fff}
.contact-card .cc-status{color:var(--orange-text)}
.agent-foot{border-top-color:#eef0f4;background:#fff}
.agent-form textarea{border:1px solid #dfe3eb;background:#fff}
.agent-form textarea:focus{outline:none;border-color:var(--blue)}
.agent-meta{color:#7a8193}
.agent-meta button{color:var(--blue)}
.agent-launcher{background:#131722;border-radius:14px;padding:8px 16px 8px 8px}
.agent-launcher .bot{border-radius:9px;background:#fff}
.agent-launcher .bot::before{background:var(--blue);box-shadow:inset -5px 0 0 -2px var(--blue)}