/* 按最新参考图：无标题栏、无收起按钮、无底部提示区。 */
.chat-panel { position:fixed; inset:auto 0 0 0; margin:0; padding:0; width:100%; max-width:100%; height:70vh; height:70dvh; max-height:70dvh; border:1px solid #c6b78d; border-bottom:0; border-radius:18px 18px 0 0; background:#fff; color:#666; box-shadow:0 -10px 36px rgba(0,0,0,.28); overflow:hidden; z-index:99; }
.chat-panel[popover] { display:none; }
.chat-panel[popover]:popover-open { display:flex; flex-direction:column; animation:chatSheetIn .25s ease-out both; }
.chat-panel::backdrop { background:rgba(12,8,3,.38); }
.chat-toolbar { display:flex; flex-shrink:0; align-items:center; justify-content:space-between; box-sizing:border-box; min-height:34px; padding:5px 11px; background:#fcfbf8; border:0; border-bottom:1px solid #e8e6e0; color:#85877d; font-size:11px; }
#chat-mode { white-space:nowrap; }
#chat-reload { border:0; background:transparent; color:#757b6b; cursor:pointer; font:inherit; padding:4px; white-space:nowrap; -webkit-tap-highlight-color:transparent; }
#chat-reload:focus-visible { outline:2px solid #b8a777; outline-offset:0; border-radius:4px; }
.chat-content { flex:1; min-height:0; position:relative; background:#f7f6f2; }
.chat-content iframe { display:block; width:100%; height:100%; border:0; margin:0; background:#f7f6f2; }
body.chat-open { overflow:hidden; }
[data-open-chat] { cursor:pointer; }
button[data-open-chat] { font-family:inherit; }
@keyframes chatSheetIn { from { transform:translateY(100%); opacity:.4; } to { transform:translateY(0); opacity:1; } }
@media(min-width:601px) {
 .chat-panel { inset:auto 24px 24px auto; width:min(480px,calc(100vw - 48px)); max-width:480px; height:min(640px,65vh); height:min(640px,65dvh); max-height:calc(100dvh - 48px); border-radius:18px; border-bottom:1px solid #c6b78d; box-shadow:0 12px 48px rgba(0,0,0,.3); }
}
@media(prefers-reduced-motion:reduce) { .chat-panel[popover]:popover-open { animation:none; } }

/* 最新工具栏：左侧重新加载、右侧收起、顶部浅金线。 */
.chat-toolbar { height:28px; min-height:28px; padding:0 8px; border-top:2px solid #c5a35c; border-bottom:0; border-radius:17px 17px 0 0; font-size:11px; }
#chat-reload { height:26px; margin-right:auto; padding:0 5px; }
#chat-close { display:grid; place-items:center; width:32px; height:26px; padding:0; border:0; background:transparent; color:#65675f; cursor:pointer; }
.chat-chevron { display:block; width:9px; height:9px; border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor; transform:translateY(-2px) rotate(45deg); }
#chat-close:focus-visible { outline:2px solid #b8a777; outline-offset:-2px; border-radius:4px; }

/* 展开区域固定，阻止背景跟随滚动，内嵌内容只在自身窗口内显示。 */
.chat-panel { position:fixed; resize:none; overflow:hidden; overscroll-behavior:contain; }
.chat-content { overflow:hidden; }
html:has(.chat-panel:popover-open),body:has(.chat-panel:popover-open) { overflow:hidden; overscroll-behavior:none; }

/* 加载反馈仅覆盖客服内容区域，成功触发加载事件后收起。 */
.chat-load-status { position:absolute; z-index:2; left:12px; right:12px; top:14px; padding:12px; border:1px solid #ddcfaf; border-radius:9px; background:#fffdf5; color:#746441; font:12px/1.7 Arial,'PingFang SC',sans-serif; box-shadow:0 3px 12px #0001; }
.chat-load-status[hidden] { display:none; }
.chat-load-status p { margin:0 0 8px; }
.chat-load-actions { display:flex; gap:14px; align-items:center; }
.chat-load-actions button,.chat-load-actions a { padding:3px 0; border:0; background:none; color:#8d6d2e; font:inherit; text-decoration:underline; cursor:pointer; }

/* 打开时固定像素宽高，键盘弹出只改变位置。 */
@media(max-width:600px) {
 .chat-panel[data-mobile-locked="true"] {
  top:var(--chat-keyboard-top); bottom:auto; left:0; right:auto;
  width:var(--chat-keyboard-width); max-width:none; height:var(--chat-keyboard-height); max-height:var(--chat-keyboard-height);
  transform:none; animation:none;
 }
 .chat-panel,.chat-content,.chat-content iframe { -webkit-text-size-adjust:100%; text-size-adjust:100%; }
}
