#ft-chat-widget {
            position: fixed;
            bottom: 24px;
            right: 24px;
            z-index: 9999;
            display: flex;
            flex-direction: column;
            align-items: flex-end;
            gap: 12px;
            font-family: 'Montserrat', sans-serif;
        }
        #ft-chat-panel {
            width: 340px;
            background: var(--bg-card);
            border-radius: 16px;
            border: 1px solid var(--border);
            overflow: hidden;
            display: none;
            flex-direction: column;
            box-shadow: 0 12px 40px rgba(0,0,0,0.7);
        }
        .ft-chat-header {
            background: var(--bg-raised);
            padding: 14px 16px;
            display: flex;
            align-items: center;
            gap: 10px;
            border-bottom: 1px solid var(--border);
        }
        .ft-chat-dot { width: 8px; height: 8px; border-radius: 50%; background: #22c55e; flex-shrink: 0; }
        .ft-chat-header-info { flex: 1; }
        .ft-chat-header-info p { margin: 0; font-size: 13px; font-weight: 600; color: var(--text-p); font-family: 'Montserrat Alternates', sans-serif; }
        .ft-chat-header-info span { font-size: 11px; color: var(--text-s); }
        .ft-chat-close { background: none; border: none; color: var(--text-s); cursor: pointer; font-size: 20px; line-height: 1; padding: 0; transition: color 0.15s; }
        .ft-chat-close:hover { color: var(--text-p); }
        .ft-chat-suggestions {
            display: flex;
            flex-wrap: wrap;
            gap: 6px;
            padding: 10px 12px;
            border-bottom: 1px solid var(--border);
            background: var(--bg-card);
        }
        .ft-chat-pill {
            font-size: 11px;
            padding: 5px 10px;
            border-radius: 9999px;
            border: 1px solid var(--border);
            color: var(--text-s);
            cursor: pointer;
            background: transparent;
            font-family: 'Montserrat', sans-serif;
            transition: all 0.15s;
            white-space: nowrap;
        }
        .ft-chat-pill:hover { border-color: var(--border-s); color: var(--text-p); background: var(--bg-raised); }
        .ft-chat-messages {
            padding: 14px;
            display: flex;
            flex-direction: column;
            gap: 10px;
            background: var(--bg-card);
            min-height: 220px;
            max-height: 280px;
            overflow-y: auto;
            scrollbar-width: thin;
            scrollbar-color: var(--border) var(--bg-page);
        }
        .ft-msg { display: flex; gap: 8px; align-items: flex-end; }
        .ft-msg.user { flex-direction: row-reverse; }
        .ft-msg-avatar {
            width: 28px; height: 28px; border-radius: 50%;
            background: var(--bg-raised); border: 1px solid var(--border);
            display: flex; align-items: center; justify-content: center;
            flex-shrink: 0; font-size: 13px; color: var(--text-p); overflow: hidden;
        }
        .ft-msg-avatar img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
        .ft-msg-bubble {
            padding: 8px 12px; border-radius: 12px;
            font-size: 12.5px; line-height: 1.5; max-width: 220px;
            color: var(--text-p);
        }
        .ft-msg.bot .ft-msg-bubble {
            background: var(--bg-raised); border: 1px solid var(--border);
            border-radius: 4px 12px 12px 12px;
        }
        .ft-msg.user .ft-msg-bubble {
            background: var(--btn-bg); color: var(--btn-fg);
            border-radius: 12px 4px 12px 12px;
        }
        .ft-typing span {
            display: inline-block; width: 6px; height: 6px;
            border-radius: 50%; background: var(--text-s);
            animation: ftBlink 1.2s infinite; margin: 0 2px;
        }
        .ft-typing span:nth-child(2) { animation-delay: 0.2s; }
        .ft-typing span:nth-child(3) { animation-delay: 0.4s; }
        @keyframes ftBlink { 0%,80%,100%{opacity:0.3} 40%{opacity:1} }
        .ft-chat-input-wrap {
            padding: 10px 12px;
            border-top: 1px solid var(--border);
            display: flex; gap: 8px; align-items: center;
            background: var(--bg-card);
        }
        #ft-chat-input {
            flex: 1;
            border: 1px solid var(--border);
            border-radius: 20px;
            padding: 7px 14px;
            font-size: 12.5px;
            outline: none;
            color: var(--text-p);
            background: var(--bg-raised);
            font-family: 'Montserrat', sans-serif;
            transition: border-color 0.2s;
            width: auto;
            height: auto;
        }
        #ft-chat-input:focus { border-color: var(--border-s); box-shadow: none; }
        #ft-chat-input::placeholder { color: var(--text-s); }
        .ft-chat-send {
            width: 34px; height: 34px; border-radius: 50%;
            background: var(--btn-bg); border: none; cursor: pointer;
            display: flex; align-items: center; justify-content: center;
            flex-shrink: 0; transition: background 0.15s, transform 0.15s;
        }
        .ft-chat-send:hover { background: var(--btn2-bg); transform: scale(1.05); }
        .ft-chat-send svg { width: 15px; height: 15px; fill: none; stroke: var(--btn-fg); stroke-width: 2; }
        .ft-chat-footer {
            padding: 6px;
            text-align: center;
            font-size: 10px;
            color: var(--text-m);
            background: var(--bg-card);
            border-top: 1px solid var(--border);
        }
        #ft-chat-toggle {
            width: 54px; height: 54px; border-radius: 50%;
            background: var(--btn-bg); border: none; cursor: pointer;
            display: flex; align-items: center; justify-content: center;
            box-shadow: 0 4px 20px rgba(0,0,0,0.6);
            transition: background 0.15s, transform 0.15s;
        }
        #ft-chat-toggle:hover { background: var(--btn2-bg); transform: scale(1.05); }
        #ft-chat-toggle svg { width: 26px; height: 26px; fill: none; stroke: var(--btn-fg); stroke-width: 2; }
        .ft-notif-badge {
            position: absolute;
            top: -2px; right: -2px;
            width: 14px; height: 14px;
            border-radius: 50%;
            background: #ef4444;
            border: 2px solid var(--bg-page);
            font-size: 9px;
            color: white;
            display: flex; align-items: center; justify-content: center;
            font-weight: 700;
        }
        #ft-chat-toggle-wrap { position: relative; }