:root {
    --bg-main: #131314;
    --bg-side: #1e1f20;
    --bg-button: #2a2b2d;
    --bg-button-hover: #3c4043;
    --text-color: #e3e3e3;
    --accent-blue: #a8c7fa;
    --accent-purple: #c3b3f9;
    --text-muted: #9aa0a6;
    --btn-red: #ea4335;
    --btn-blue: #1a73e8;
}
body { margin: 0; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; background: var(--bg-main); color: var(--text-color); display: flex; flex-direction: column; height: 100vh; }

/* Header */
.header { background: var(--bg-side); padding: 10px 20px; display: flex; align-items: center; gap: 15px; border-bottom: 1px solid var(--bg-button); flex-wrap: wrap; }
.header h1 { font-family: 'Product Sans', sans-serif; font-size: 18px; color: var(--accent-blue); margin: 0; }
select { background: var(--bg-main); color: var(--text-color); border: 1px solid var(--bg-button-hover); padding: 6px 10px; border-radius: 4px; }
button { background: var(--bg-button); color: var(--text-color); border: none; padding: 8px 15px; border-radius: 4px; cursor: pointer; font-weight: bold; font-size: 13px; }
button:hover { background: var(--bg-button-hover); }
.btn-red { background: var(--btn-red); color: white; }
.status { margin-left: auto; font-weight: bold; font-size: 13px; color: #34a853; }

/* Chat Area */
.chat-container { flex: 1; overflow-y: auto; padding: 20px; }
.message { margin-bottom: 20px; white-space: pre-wrap; word-wrap: break-word; line-height: 1.5; }
.msg-user { color: var(--text-color); }
.msg-user-title { color: var(--accent-blue); font-weight: bold; margin-bottom: 5px; }
.msg-gemini { color: var(--text-color); }
.msg-gemini-title { color: var(--accent-purple); font-weight: bold; margin-bottom: 5px; }
.msg-system { color: var(--text-muted); font-style: italic; font-size: 13px; }
img { max-width: 450px; border-radius: 8px; margin-top: 10px; }

/* Code Blocks */
.code-block { background: #161b22; border-radius: 6px; padding: 10px; font-family: Consolas, monospace; font-size: 13px; overflow-x: auto; margin: 10px 0; border: 1px solid #3c4043; }
.code-header { font-weight: bold; font-size: 11px; margin-bottom: 5px; }
.bash-hdr { color: #34a853; }
.python-hdr { color: var(--accent-purple); }

/* Input Area */
.input-area { background: var(--bg-main); padding: 15px 20px; display: flex; flex-direction: column; gap: 10px; border-top: 1px solid var(--bg-button); }
.staged-info { color: var(--accent-blue); font-size: 12px; font-style: italic; min-height: 16px; }
.input-row { display: flex; gap: 10px; }
textarea { flex: 1; background: var(--bg-side); color: var(--text-color); border: 1px solid var(--bg-button-hover); border-radius: 6px; padding: 12px; resize: none; font-family: 'Segoe UI'; font-size: 14px; }
.actions { display: flex; flex-direction: column; gap: 5px; }