:root {
    --bg-primary: #212121;
    --bg-secondary: #171717;
    --bg-tertiary: #2f2f2f;
    --text-primary: #ececec;
    --text-secondary: #b4b4b4;
    --text-muted: #666;
    --accent: #10a37f;
    --accent-hover: #0e8c6b;
    --border: #444;
    --danger: #ff6b6b;
    --success: #6bff9e;
    --warning: #ffd700;
}

/* Scrollbar */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--border); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #555; }

/* Base */
body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; }

/* Code blocks */
pre { background: #111; padding: 16px; border-radius: 8px; overflow-x: auto; border: 1px solid #333; margin: 8px 0; }
code { font-family: 'Consolas', 'Monaco', 'Courier New', monospace; font-size: 13px; }
pre code { background: none; padding: 0; }
:not(pre) > code { background: #2f2f2f; padding: 2px 6px; border-radius: 4px; font-size: 13px; }

/* Tables */
.message-content table { width: 100%; border-collapse: collapse; margin: 8px 0; }
.message-content th, .message-content td { border: 1px solid #444; padding: 8px 12px; }
.message-content th { background: #2f2f2f; font-weight: 600; }

/* Blockquotes */
.message-content blockquote { border-left: 3px solid var(--accent); padding-left: 12px; color: #999; margin: 8px 0; }

/* Headings in messages */
.message-content h1, .message-content h2, .message-content h3,
.message-content h4, .message-content h5, .message-content h6 {
    margin: 12px 0 8px; font-weight: 600;
}
.message-content h1 { font-size: 22px; }
.message-content h2 { font-size: 18px; }
.message-content h3 { font-size: 16px; }

/* Lists */
.message-content ul, .message-content ol { padding-left: 20px; margin: 8px 0; }
.message-content li { margin-bottom: 4px; }

/* Links */
.message-content a { color: var(--accent); text-decoration: none; }
.message-content a:hover { text-decoration: underline; }

/* Toast notification */
.toast-notification { position: fixed; bottom: 20px; left: 50%; transform: translateX(-50%); background: #171717; border: 1px solid #444; color: #ececec; padding: 12px 24px; border-radius: 8px; font-size: 14px; z-index: 9999; animation: fadeInUp 0.3s; }
@keyframes fadeInUp { from { opacity: 0; transform: translateX(-50%) translateY(20px); } to { opacity: 1; transform: translateX(-50%) translateY(0); } }

/* Image gallery in chat */
.image-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; margin: 8px 0; }
.image-gallery img { width: 100%; border-radius: 8px; cursor: pointer; transition: transform 0.2s; }
.image-gallery img:hover { transform: scale(1.02); }