#drawer { top:var(--desktop-titlebar-height,0px); height:calc(100dvh - var(--desktop-titlebar-height,0px)); width:min(560px,100vw); padding:0; background:#fff; display:flex; flex-direction:column; box-sizing:border-box; }
#drawer .drawer-head { flex:none; padding:16px 20px 10px; gap:12px; border:0; }
#drawer .drawer-head h2 { font-size:18px; line-height:1.4; min-width:0; }
.test-chat-head-actions { display:flex; align-items:center; gap:8px; flex:none; }
#drawer .test-chat-head-actions button { margin:0; padding:6px 10px; font-size:12px; min-height:32px; background:#fff; color:#52647b; border:1px solid #dce5ef; border-radius:8px; }
.test-chat-note { flex:none; margin:0; padding:0 20px 12px; color:#718096; font-size:12px; border-bottom:1px solid #e6edf5; }
.test-chat-settings { flex:0 1 auto; min-height:0; max-height:43%; overflow:auto; padding:0 20px; border-bottom:1px solid #e6edf5; background:#f8fafc; }
.test-chat-settings summary { cursor:pointer; padding:12px 0; font-size:13px; font-weight:600; color:#354b65; }
.test-chat-settings-caption { display:inline-block; vertical-align:bottom; max-width:65%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; margin-left:10px; font-size:12px; font-weight:400; color:#718096; }
#drawer .chat-mode-panel { margin:0; max-height:none; overflow:visible; }
#drawer .chat-role-section { margin:0 0 10px; }
#drawer .chat-role-label { display:none; }
#drawer .chat-role-card,#drawer .chat-role-card.active { min-height:44px; padding:8px 10px; border:1px solid #e0e8f2; border-radius:8px; background:#fff; color:#354b65; box-shadow:none; transform:none; }
#drawer .chat-role-icon { width:28px; height:28px; border-radius:7px; font-size:15px; background:#edf3ff; color:#2563eb; }
#drawer .chat-role-copy strong { font-size:12px; }
#drawer .chat-role-copy small { font-size:11px; color:#7a8ba1; }
#drawer .chat-context-grid { gap:8px 12px; }
#drawer .chat-context-grid label,#drawer .chat-role-section > label { font-size:12px; color:#64758b; }
#drawer select { margin:4px 0 0; padding:7px 9px; min-height:34px; border-radius:7px; font-size:12px; }
#drawer .chat-role-section > label { display:block; margin-top:10px; }
#drawer #chatWecomEmployeeHint,#drawer .chat-context-hint { display:block; margin:8px 0 12px; font-size:11px; line-height:1.6; color:#75859a; overflow-wrap:anywhere; }
.test-chat-settings-tools { display:flex; flex-wrap:wrap; gap:8px; margin-top:8px; }
.test-chat-settings-tools button { padding:6px 9px; font-size:11px; border:1px solid #dce5ef; border-radius:7px; background:#fff; color:#52647b; }
#drawer #log { flex:1 1 0; min-height:80px; margin:0; padding:18px 20px; border:0; border-radius:0; background:#fff; white-space:normal; line-height:1.65; }
#drawer #log:not(.test-chat-has-messages) { display:none; }
.test-chat-empty { flex:1 1 0; min-height:80px; display:flex; flex-direction:column; justify-content:center; align-items:center; padding:20px; text-align:center; color:#60748e; background:#fff; }
.test-chat-empty[hidden] { display:none; }
.test-chat-empty strong { font-size:14px; font-weight:500; }
.test-chat-empty p { max-width:270px; font-size:12px; line-height:1.8; margin:8px 0; color:#8a99ac; }
.test-chat-message { display:flex; flex-direction:column; align-items:flex-start; margin:0 0 18px; }
.test-chat-message small { color:#8a99ac; font-size:11px; margin:0 3px 5px; }
.test-chat-bubble { max-width:92%; padding:10px 13px; border-radius:3px 12px 12px; background:#f0f4f9; color:#344860; font-size:13px; white-space:pre-wrap; overflow-wrap:anywhere; }
.test-chat-user { align-items:flex-end; }
.test-chat-user .test-chat-bubble { border-radius:12px 3px 12px 12px; background:#eaf1ff; color:#234c93; }
.test-chat-error .test-chat-bubble { background:#fff2f1; color:#a94741; }
#drawer #chatForm { flex:none; align-items:stretch; margin:0; padding:12px 20px 6px; border-top:1px solid #e6edf5; gap:10px; }
#drawer #chatMessage { flex:1; min-width:0; width:0; margin:0; min-height:66px; height:66px; max-height:120px; padding:10px 12px; font-family:inherit; font-size:13px; line-height:1.6; resize:vertical; border:1px solid #dce5ef; border-radius:9px; }
#drawer #chatForm button { min-width:100px; padding:9px 12px; border-radius:9px; font-size:12px; }
.test-chat-keyboard-hint { flex:none; padding:0 20px 12px; font-size:10px; color:#8a99ac; }
@media(max-height:600px) { .test-chat-settings { max-height:35%; } #drawer .drawer-head { padding-top:10px; } }
@media(max-width:420px) { #drawer .drawer-head h2 { font-size:15px; } #drawer .drawer-head,#drawer #chatForm { padding-left:12px; padding-right:12px; } .test-chat-settings { padding:0 12px; } #drawer #chatForm button { min-width:86px; padding:8px; } }