@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap');

:root {
    --font-body: 'Space Grotesk', 'Segoe UI', sans-serif;
    --font-heading: 'Space Grotesk', 'Segoe UI', sans-serif;

    --bg: #07090f;
    --bg-elev: #11141c;
    --text: #f5f7fb;
    --muted: #9aa4b8;

    --line: rgba(255, 255, 255, 0.08);
    --line-strong: rgba(255, 255, 255, 0.18);

    --accent: #13cf72;
    --accent-contrast: #072110;

    --page-bg: radial-gradient(circle at 10% 0%, #121724 0%, #07090f 44%), var(--bg);
    --nav-bg: rgba(16, 20, 30, 0.78);
    --nav-item-hover-bg: rgba(255, 255, 255, 0.08);
    --nav-item-active-bg: rgba(255, 255, 255, 0.12);

    --chat-toggle-border: rgba(110, 174, 255, 0.55);
    --chat-toggle-bg: linear-gradient(135deg, rgba(64, 122, 255, 0.18), rgba(81, 181, 255, 0.24));
    --chat-toggle-text: #b9dcff;

    --chat-panel-bg: rgba(12, 16, 24, 0.97);
    --chat-panel-shadow: 0 16px 40px rgba(0, 0, 0, 0.45);

    --chat-msg-user-bg: rgba(84, 118, 255, 0.18);
    --chat-msg-assistant-bg: rgba(255, 255, 255, 0.08);
    --chat-msg-error-bg: rgba(237, 81, 103, 0.2);
    --chat-msg-error-border: rgba(237, 81, 103, 0.35);

    --typing-dot-bg: rgba(245, 247, 251, 0.8);
    --chat-input-bg: rgba(255, 255, 255, 0.05);
}

h1, h2, h3, h4 {
    color: #bbbbbb;
}