.drawer { display: flex; flex-direction: column; overflow: hidden; }
.drawer-head, .tabs { flex: 0 0 auto; }
.tab-panel.active:not(.chat-panel) { min-height: 0; overflow-y: auto; }
.chat-panel.active { display: flex; flex: 1 1 auto; flex-direction: column; min-height: 0; margin: 0 -20px -24px; background: #101615; overflow: hidden; }
.chat-header { position: sticky; top: -1px; z-index: 2; display: flex; align-items: center; gap: 11px; padding: 12px 20px; border-bottom: 1px solid #ffffff10; background: #0c1312eb; backdrop-filter: blur(18px); }
.chat-avatar { display: grid; place-items: center; width: 38px; height: 38px; flex: 0 0 38px; border-radius: 10px; background: linear-gradient(145deg,#9ce9cd,#46ad88); color: #09231b; font-weight: 800; }
.chat-header > div:last-child { display: grid; gap: 2px; }
.chat-header strong { font-size: 15px; }
.chat-header span { color: var(--muted); font-size: 10px; }
.chat-thread { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; gap: 15px; overflow-y: auto; padding: 18px 16px 24px; scroll-behavior: smooth; overscroll-behavior: contain; }
.chat-empty { margin: auto; max-width: 240px; color: var(--muted); font-size: 12px; line-height: 1.65; text-align: center; }
.chat-message { display: flex; align-items: flex-start; gap: 8px; max-width: 88%; }
.chat-message.user { align-self: flex-end; flex-direction: row-reverse; }
.message-avatar { display: grid; place-items: center; width: 32px; height: 32px; flex: 0 0 32px; border-radius: 8px; background: #26302e; color: #cfd7d4; font-size: 11px; }
.chat-message.assistant .message-avatar { background: #7fdaba; color: #09231b; font-weight: 800; }
.message-stack { display: grid; gap: 5px; min-width: 0; }
.message-bubble { position: relative; padding: 10px 12px; border-radius: 5px 14px 14px 14px; background: #26302e; color: #edf3f0; line-height: 1.5; white-space: pre-wrap; overflow-wrap: anywhere; }
.chat-message.user .message-bubble { border-radius: 14px 5px 14px 14px; background: #8ee9c6; color: #09231b; }
.message-time { color: #6f7e7a; font-size: 9px; }
.chat-message.user .message-time { text-align: right; }
.message-audio { display: flex; align-items: center; gap: 8px; min-width: 210px; padding: 7px 9px; border-radius: 11px; background: #1b2422; }
.message-audio span { color: var(--mint); font-size: 10px; white-space: nowrap; }
.message-audio audio { width: 100%; height: 30px; min-width: 145px; }
.chat-composer { position: sticky; bottom: 0; z-index: 2; display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 8px; padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); border-top: 1px solid #ffffff12; background: #0c1312f5; }
.chat-composer textarea { min-height: 42px; max-height: 116px; resize: none; border: 0; border-radius: 10px; background: #202927; line-height: 1.4; }
.chat-composer button { min-width: 58px; height: 42px; border: 0; border-radius: 10px; background: var(--mint); color: #09231b; font-weight: 750; }
.chat-composer button:disabled { opacity: .48; }
.chat-retention { margin: 0; padding: 0 16px 7px; background: #0c1312f5; color: #667470; font-size: 9px; text-align: center; }
@media (min-width: 700px) { .chat-message { max-width: 78%; } }