.chat-screen { display: flex; flex-direction: column; height: calc(100vh - 70px); }
.chat-header { display: flex; align-items: center; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--border); margin-bottom: 16px; flex-shrink: 0; }
.skill-buttons { display: flex; gap: 8px; }
.skill-buttons button { padding: 6px 12px; border: 1px solid var(--border); border-radius: 4px; cursor: pointer; background: var(--surface); color: var(--text-primary); }
.skill-buttons button:hover { background: var(--accent); color: white; border-color: var(--accent); }
.chat-messages { flex: 1; overflow-y: auto; display: flex; flex-direction: column; gap: 12px; margin-bottom: 16px; }
.msg { padding: 12px 16px; border-radius: 8px; max-width: 80%; white-space: pre-wrap; line-height: 1.5; }
.msg-user { background: var(--accent); color: white; align-self: flex-end; }
.msg-assistant { background: var(--surface); border: 1px solid var(--border); align-self: flex-start; }
.chat-input-row { display: flex; gap: 12px; flex-shrink: 0; }
.chat-input-row textarea { flex: 1; padding: 10px; border: 1px solid var(--border); border-radius: 6px; resize: vertical; background: var(--surface); color: var(--text-primary); }
.chat-input-row button { padding: 10px 20px; background: var(--accent); color: white; border: none; border-radius: 6px; cursor: pointer; white-space: nowrap; }
.chat-input-row button:hover { background: var(--accent-hover); }