/* Giao diện khung chat Trạm AI / Trợ lý AI — tách từ chatbotai.php (qtai_chatbot_shortcode). Sửa CSS khung chat Ở ĐÂY. */
            /* Gói KHÓA 1 MODEL (vd Pro): ẩn ô chọn model (giữ chiều cao như docchat để không sập layout). */
            .qtai-single-model-mode .qtai-chatbot-island-wrap {
                display: block !important; visibility: hidden; pointer-events: none;
            }
            /* GÓI FREE (chưa mua gói): KHÓA ô chọn model — Free đã bị chặn chat, không cho chọn model cao cấp. */
            .qtai-free-mode .qtai-chatbot-island-wrap {
                display: block !important; visibility: hidden; pointer-events: none;
            }
            /* Gói Chat Với Tài Liệu: ẩn chọn model + tạo ảnh/video/canvas -> chuyên chat tài liệu. */
            .qtai-docchat-mode .qtai-chatbot-island-wrap,
            .qtai-docchat-mode #qtai-chatbot-image-mode,
            .qtai-docchat-mode #qtai-chatbot-video-mode,
            .qtai-docchat-mode #qtai-chatbot-video-continue,
            .qtai-docchat-mode #qtai-chatbot-canvas-toggle { display: none !important; }
            /* Chat chỉ là chat: tạo ảnh chuyển sang Xưởng tạo ảnh /ai-tao-anh/ -> ẩn nút bật chế độ ảnh. */
            #qtai-chatbot-image-mode { display: none !important; }
            /* HẾT GÓI (mọi dòng điểm cạn): ẩn ô chọn model, hiện banner đỏ mời mua gói. */
            .qtai-exhausted-mode .qtai-chatbot-island-wrap { display: none !important; }
            .qtai-chatbot-exhausted-banner { display: none; }
            .qtai-exhausted-mode .qtai-chatbot-exhausted-banner {
                display: block; text-align: center; line-height: 1.6;
                background: rgba(220,38,38,.09); border: 1px solid rgba(220,38,38,.42); color: #dc2626;
                border-radius: 14px; padding: 11px 16px; font-size: 13.5px; font-weight: 700; margin: 12px auto 0; max-width: 840px;
            }
            .qtai-chatbot-exhausted-banner a { color: #dc2626; text-decoration: underline; font-weight: 800; }
            .qtai-chatbot-exhausted-banner a:hover { text-decoration: none; }
            /* Gói docchat ẩn hàng chọn model. Thay vì display:none (làm sập hàng -> vòng tròn hạn mức
               đè nút gửi), GIỮ CHỖ hàng model (ẩn nội dung, giữ chiều cao) để vòng tròn nằm ĐÚNG góc
               trên-phải GIỐNG HỆT gói có model. FAB dùng vị trí gốc (top:0; right:25). */
            .qtai-docchat-mode .qtai-chatbot-island-wrap {
                display: block !important;
                visibility: hidden;
                pointer-events: none;
            }
            .qtai-chatbot-app, .qtai-chatbot-app *, .qtai-chatbot-app *::before, .qtai-chatbot-app *::after { box-sizing: border-box; }
            .qtai-chatbot-app button,
            .qtai-chatbot-app .button,
            .qtai-chatbot-app input[type="button"],
            .qtai-chatbot-app input[type="submit"] {
                margin: 0 !important;
            }
            .qtai-chatbot-app textarea {
                margin-bottom: 0 !important;
            }
            .qtai-chatbot-app {
                --qtai-sidebar-w: 280px;
                --qtai-app-vh-offset: 0px;
                --qtai-paper: #FAF8F4;
                --qtai-paper-deep: #F5F1E8;
                --qtai-ink: #2C3E35;
                --qtai-ink-muted: #5A6B62;
                --qtai-tea: #1A4D8F;
                --qtai-tea-light: #2563EB;
                --qtai-tea-border: #B8C9E8;
                --qtai-tea-bg: #EEF4FD;
                --qtai-accent: #0D9488;
                --qtai-accent-dark: #0F766E;
                --qtai-accent-light: #E6FFFA;
                /* Xanh thương hiệu. Hai biến vì hai vai trò khác nhau:
                   -brand      = nền ĐẶC có chữ trắng đè lên (nút Gửi, avatar) -> rgb(35,125,90).
                   -brand-text = CHỮ xanh nằm trên nền -> phải sáng hơn mới đọc được,
                                 rgb(35,125,90) trên nền tối chỉ đạt ~3.3:1.
                   Cả hai dùng CHUNG cho nền sáng lẫn nền tối (không override trong
                   .qtai-dark) nên hai chế độ trông giống hệt nhau.
                   Cố ý KHÔNG gộp vào --qtai-tea vì biến đó còn chạy cho hàng loạt
                   nút/viền xanh dương khác. */
                --qtai-brand: #237D5A;
                --qtai-brand-text: #3FA97D;
                --qtai-send: var(--qtai-brand);
                --qtai-border: #D9D2C5;
                --qtai-border-light: #E8E2D6;
                --qtai-white: #ffffff;
                --qtai-shadow: rgba(26, 77, 143, 0.12);
                --qtai-user-bg: #E8F4FD;
                --qtai-assistant-bg: #ffffff;
                font-family: 'Segoe UI', system-ui, sans-serif;
                color: var(--qtai-ink);
                background: var(--qtai-paper);
                border: 1px solid var(--qtai-border-light);
                border-radius: 12px;
                box-shadow: 0 8px 28px var(--qtai-shadow);
                overflow: hidden;
                width: 100%;
                max-width: 100%;
                margin: 0 auto;
                display: flex;
                flex-direction: column;
                min-height: calc(100vh - var(--qtai-app-vh-offset));
                height: calc(100vh - var(--qtai-app-vh-offset));
                max-height: calc(100vh - var(--qtai-app-vh-offset));
            }
            @supports (height: 100dvh) {
                .qtai-chatbot-app {
                    min-height: calc(100dvh - var(--qtai-app-vh-offset));
                    height: calc(100dvh - var(--qtai-app-vh-offset));
                    max-height: calc(100dvh - var(--qtai-app-vh-offset));
                }
            }
            body.admin-bar .qtai-chatbot-app {
                --qtai-app-vh-offset: 64px;
            }
            /* Chip trích dẫn: rê chuột hiện đoạn gốc trong file đã tải lên */
            .qtai-chatbot-app .qtai-cite {
                display: inline-block;
                vertical-align: baseline;
                margin-left: 5px;
                padding: 1px 6px;
                border: 1px solid var(--qtai-border);
                border-radius: 5px;
                background: var(--qtai-tea-bg);
                color: var(--qtai-muted, #5a6b7f);
                font-size: 10px;
                font-weight: 700;
                letter-spacing: .3px;
                line-height: 1.5;
                cursor: help;
                user-select: none;
                transition: background .15s, border-color .15s;
            }
            .qtai-chatbot-app .qtai-cite:hover,
            .qtai-chatbot-app .qtai-cite:focus {
                background: var(--qtai-accent-light);
                border-color: var(--qtai-accent);
                color: var(--qtai-accent-dark);
                outline: none;
            }
            .qtai-chatbot-app.qtai-dark .qtai-cite {
                background: rgba(255,255,255,.06);
                border-color: var(--qtai-border);
                color: #9fb3c8;
            }
            .qtai-chatbot-app.qtai-dark .qtai-cite:hover,
            .qtai-chatbot-app.qtai-dark .qtai-cite:focus {
                background: rgba(13,148,136,.18);
                border-color: var(--qtai-accent);
                color: #5eead4;
            }
            /* Hộp tooltip nổi — gắn vào body nên không bị bong bóng chat cắt mất */
            .qtai-cite-tip {
                position: fixed;
                z-index: 2147483000;
                max-width: 380px;
                padding: 10px 12px;
                border-radius: 10px;
                background: #1b2638;
                color: #e6edf6;
                border: 1px solid #2c3a4d;
                box-shadow: 0 10px 30px rgba(0,0,0,.28);
                font-size: 12.5px;
                line-height: 1.6;
                pointer-events: none;
                opacity: 0;
                transition: opacity .12s;
            }
            .qtai-cite-tip.qtai-on { opacity: 1; }
            .qtai-cite-tip .qtai-cite-tip-head {
                display: flex; align-items: center; gap: 6px;
                margin-bottom: 6px; padding-bottom: 6px;
                border-bottom: 1px solid #2c3a4d;
                font-size: 11px; font-weight: 700; color: #9fb3c8;
            }
            .qtai-cite-tip .qtai-cite-tip-body {
                max-height: 190px; overflow: auto;
                white-space: pre-wrap; word-break: break-word;
            }
            /* Blockquote trong tin nhắn: ghi đè style theme (Flatsome) để đọc rõ ở cả sáng/tối */
            .qtai-chatbot-app .qtai-chatbot-msg-bubble blockquote {
                margin: 0 0 12px !important;
                padding: 4px 0 4px 14px !important;
                border-left: 3px solid var(--qtai-accent) !important;
                background: transparent !important;
                font-style: normal !important;
            }
            .qtai-chatbot-app .qtai-chatbot-msg-bubble blockquote,
            .qtai-chatbot-app .qtai-chatbot-msg-bubble blockquote p,
            .qtai-chatbot-app .qtai-chatbot-msg-bubble blockquote li {
                color: var(--qtai-ink) !important;
                opacity: .92;
            }
            /* ===== Dark mode ===== */
            .qtai-chatbot-app.qtai-dark {
                --qtai-paper: #0f172a;
                --qtai-paper-deep: #16202e;
                --qtai-ink: #e6edf3;
                --qtai-ink-muted: #9fb0c0;
                --qtai-tea: #60a5fa;
                --qtai-tea-light: #93c5fd;
                --qtai-tea-border: #2f4660;
                --qtai-tea-bg: #16263b;
                --qtai-accent: #2dd4bf;
                --qtai-accent-dark: #14b8a6;
                --qtai-accent-light: #0f3d39;
                --qtai-border: #2c3a4d;
                --qtai-border-light: #26334a;
                --qtai-white: #1b2638;
                --qtai-shadow: rgba(0, 0, 0, 0.45);
                --qtai-user-bg: #1e3a5f;
                --qtai-assistant-bg: #1b2638;
                color: var(--qtai-ink);
                background: var(--qtai-paper);
            }
            .qtai-chatbot-app.qtai-dark .qtai-chatbot-input,
            .qtai-chatbot-app.qtai-dark .qtai-chatbot-edit-input,
            .qtai-chatbot-app.qtai-dark textarea,
            .qtai-chatbot-app.qtai-dark input[type="text"],
            .qtai-chatbot-app.qtai-dark input[type="search"] {
                background: #16202e;
                color: var(--qtai-ink);
                border-color: var(--qtai-border);
            }
            .qtai-chatbot-app.qtai-dark .qtai-chatbot-msg-bubble pre,
            .qtai-chatbot-app.qtai-dark .qtai-chatbot-msg-bubble code {
                background: #0b1220 !important;
                color: #e6edf3;
            }
            .qtai-chatbot-app.qtai-dark .qtai-chatbot-msg-copy,
            .qtai-chatbot-app.qtai-dark .qtai-chatbot-msg-edit,
            .qtai-chatbot-app.qtai-dark .qtai-chatbot-msg-edit-user,
            .qtai-chatbot-app.qtai-dark .qtai-chatbot-msg-regen,
            .qtai-chatbot-app.qtai-dark .qtai-chatbot-msg-speak {
                background: rgba(255, 255, 255, 0.06);
            }
            .qtai-chatbot-app.qtai-dark .qtai-chatbot-msg.assistant .qtai-chatbot-msg-bubble {
                background: transparent;
                border-color: transparent;
            }
            /* Nút đóng/mở sidebar trái (kiểu ChatGPT) — phẳng, đơn giản */
            .qtai-chatbot-sidebar-toggle-btn {
                appearance: none;
                background: transparent;
                border: none;
                border-radius: 8px;
                padding: 6px;
                cursor: pointer;
                color: var(--qtai-ink-muted);
                display: inline-flex;
                align-items: center;
                justify-content: center;
                flex: none;
                font-family: inherit;
                transition: background 0.15s, color 0.15s;
            }
            .qtai-chatbot-sidebar-toggle-btn:hover {
                background: var(--qtai-paper-deep);
                color: var(--qtai-ink);
            }
            .qtai-chatbot-sidebar-toggle-btn svg { display: block; }
            /* Hàng dưới cùng sidebar: nút sáng/tối bên trái, thông tin gói bên phải */
            .qtai-chatbot-account-row {
                display: flex;
                align-items: center;
                gap: 8px;
            }
            .qtai-chatbot-account-row > .qtai-chatbot-account-btn {
                flex: 1 1 auto;
                min-width: 0;
                width: auto;
            }
            .qtai-chatbot-dark-toggle {
                background: transparent;
                border: 1px solid var(--qtai-border);
                border-radius: 8px;
                width: 34px;
                height: 34px;
                cursor: pointer;
                color: var(--qtai-ink-muted);
                display: inline-flex;
                align-items: center;
                justify-content: center;
                font-size: 16px;
                flex: none;
                transition: background 0.15s, color 0.15s, border-color 0.15s;
            }
            .qtai-chatbot-dark-toggle:hover {
                color: var(--qtai-accent);
                border-color: var(--qtai-accent);
            }
            .qtai-chatbot-dark-toggle svg {
                width: 18px !important;
                height: 18px !important;
                min-width: 18px;
                min-height: 18px;
                display: block;
            }
            .qtai-chatbot-dark-toggle svg path,
            .qtai-chatbot-dark-toggle svg circle {
                stroke: currentColor;
                fill: none;
            }
            /* Kéo-thả file */
            .qtai-chatbot-main.qtai-drag-over {
                position: relative;
            }
            .qtai-chatbot-main.qtai-drag-over::after {
                content: '📎 Thả file vào đây để đính kèm';
                position: absolute;
                inset: 10px;
                z-index: 50;
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 16px;
                font-weight: 600;
                color: var(--qtai-accent-dark);
                background: var(--qtai-accent-light);
                border: 2px dashed var(--qtai-accent);
                border-radius: 14px;
                pointer-events: none;
            }
            /* Xuất hội thoại */
            .qtai-chatbot-export-wrap { position: relative; width: 100%; }
            .qtai-chatbot-export-btn {
                border: 1px solid var(--qtai-border);
                background: var(--qtai-white);
                color: var(--qtai-ink-muted);
                border-radius: 8px;
                padding: 5px 12px;
                font-size: 13px;
                cursor: pointer;
                transition: color 0.15s, border-color 0.15s;
            }
            .qtai-chatbot-export-btn:hover { color: var(--qtai-accent); border-color: var(--qtai-accent); }
            .qtai-chatbot-export-menu {
                position: absolute;
                top: calc(100% + 6px);
                right: 0;
                left: auto;
                z-index: 60;
                min-width: 210px;
                max-width: calc(100vw - 24px);
                background: var(--qtai-white);
                border: 1px solid var(--qtai-border);
                border-radius: 10px;
                box-shadow: 0 10px 30px var(--qtai-shadow);
                padding: 6px;
                display: flex;
                flex-direction: column;
                gap: 2px;
            }
            .qtai-chatbot-export-menu[hidden] { display: none; }
            .qtai-chatbot-export-menu button {
                text-align: left;
                border: none;
                background: transparent;
                color: var(--qtai-ink);
                padding: 8px 10px;
                border-radius: 7px;
                font-size: 13px;
                cursor: pointer;
            }
            .qtai-chatbot-export-menu button:hover { background: var(--qtai-paper-deep); }
            /* Chat với tài liệu */
            .qtai-chatbot-docs-wrap { width: 100%; }
            .qtai-chatbot-docs-count { font-weight: 700; }
            .qtai-chatbot-docs-panel {
                margin-top: 8px;
                padding: 10px;
                background: var(--qtai-paper-deep);
                border: 1px solid var(--qtai-border-light);
                border-radius: 10px;
            }
            .qtai-chatbot-docs-panel[hidden] { display: none; }
            .qtai-chatbot-docs-list { display: flex; flex-direction: column; gap: 6px; }
            .qtai-chatbot-docs-list:empty { display: none; }
            .qtai-chatbot-docs-item {
                display: flex;
                align-items: center;
                gap: 8px;
                padding: 7px 9px;
                background: var(--qtai-white);
                border: 1px solid var(--qtai-border-light);
                border-radius: 8px;
                font-size: 12px;
                color: var(--qtai-ink);
            }
            .qtai-chatbot-docs-item-icon { flex: none; font-size: 14px; }
            .qtai-chatbot-docs-item-name {
                flex: 1;
                min-width: 0;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }
            .qtai-chatbot-docs-item-del {
                flex: none;
                border: none;
                background: transparent;
                color: var(--qtai-ink-muted);
                cursor: pointer;
                font-size: 15px;
                line-height: 1;
                padding: 2px 4px;
                border-radius: 6px;
            }
            .qtai-chatbot-docs-item-del:hover { background: rgba(239,68,68,0.15); color: #dc2626; }
            .qtai-chatbot-docs-add {
                width: 100%;
                margin-top: 8px;
                padding: 8px;
                border: 1px dashed var(--qtai-accent);
                border-radius: 8px;
                background: transparent;
                color: var(--qtai-accent-dark);
                font-size: 13px;
                font-weight: 600;
                cursor: pointer;
            }
            .qtai-chatbot-docs-add:hover { background: var(--qtai-accent-light); }
            .qtai-chatbot-docs-add.is-loading { opacity: 0.6; cursor: progress; }
            .qtai-chatbot-docs-hint {
                margin: 8px 0 0;
                font-size: 11px;
                line-height: 1.4;
                color: var(--qtai-ink-muted);
            }
            /* Gợi ý hỏi tiếp */
            .qtai-chatbot-suggestions {
                display: flex;
                flex-wrap: wrap;
                gap: 6px;
                align-items: center;
                margin: 0 0 8px 44px;
                animation: qtaiSuggestIn 0.25s ease both;
            }
            @keyframes qtaiSuggestIn {
                from { opacity: 0; transform: translateY(4px); }
                to { opacity: 1; transform: none; }
            }
            .qtai-chatbot-suggestions-label {
                width: 100%;
                font-size: 11px;
                font-weight: 600;
                color: var(--qtai-ink-muted);
                letter-spacing: .01em;
                margin-bottom: 1px;
                opacity: .85;
            }
            .qtai-chatbot-suggestion-chip {
                border: 1px solid var(--qtai-tea-border);
                background: var(--qtai-tea-bg);
                color: var(--qtai-tea);
                border-radius: 999px;
                padding: 5px 12px;
                font-size: 12.5px;
                font-weight: 500;
                line-height: 1.35;
                /* Chip là <button> -> chặn theme (Flatsome) ép viết HOA / giãn chữ. */
                text-transform: none;
                letter-spacing: 0;
                cursor: pointer;
                text-align: left;
                max-width: 100%;
                transition: background 0.15s, border-color 0.15s, transform 0.1s;
            }
            .qtai-chatbot-suggestion-chip:hover {
                background: var(--qtai-tea-border);
                border-color: var(--qtai-tea);
            }
            .qtai-chatbot-suggestion-chip:active { transform: translateY(1px); }
            @media (max-width: 600px) {
                .qtai-chatbot-suggestions { margin-left: 8px; }
                .qtai-chatbot-suggestion-chip { font-size: 12px; padding: 5px 11px; }
            }
            .qtai-chatbot-qt-card {
                margin-top: 10px;
            }
            .qtai-chatbot-qt-card-img {
                display: block;
                width: 100%;
                border-radius: 12px;
                border: 1px solid var(--qtai-tea-border);
                box-shadow: 0 4px 14px rgba(0,0,0,0.08);
            }
            .qtai-chatbot-badge {
                margin-top: 10px;
                background: var(--qtai-tea-bg);
                border: 1px solid var(--qtai-tea-border);
                border-radius: 10px;
                padding: 8px 12px;
                font-size: 12px;
                line-height: 1.35;
                color: var(--qtai-tea);
                text-align: center;
            }
            .qtai-chatbot-badge[hidden] { display: none; }
            .qtai-chatbot-quota-badge {
                background: #FFFBEB;
                border-color: #FDE68A;
                color: #B45309;
                font-weight: 600;
            }
            .qtai-chatbot-quota-badge.is-empty {
                background: #FEF2F2;
                border-color: #FECACA;
                color: #B91C1C;
            }
            .qtai-chatbot-quota-reset {
                display: block;
                margin-top: 4px;
                font-size: 11px;
                font-weight: 500;
                opacity: 0.85;
            }
            /* Badge hạn mức nằm NGAY TRÊN Ô NHẬP: căn giữa, co theo nội dung (không kéo full
               chiều ngang như hồi ở sidebar), có bóng nhẹ để nổi lên khỏi nền. */
            .qtai-chatbot-compose-slot > .qtai-chatbot-quota-badge {
                width: fit-content;
                max-width: 92%;
                margin: 0 auto 10px;
                padding: 7px 14px;
                font-size: 12.5px;
                box-shadow: 0 2px 12px rgba(180, 83, 9, 0.18);
                animation: qtaiComposeChipIn 0.24s cubic-bezier(0.22, 1, 0.36, 1) both;
            }
            .qtai-chatbot-compose-slot > .qtai-chatbot-quota-badge.is-empty {
                box-shadow: 0 2px 12px rgba(185, 28, 28, 0.22);
            }
            /* Giao diện tối: màu hổ phách/đỏ sáng hard-code sẽ chói và lạc tông -> đảo nền/chữ. */
            .qtai-chatbot-app.qtai-dark .qtai-chatbot-quota-badge {
                background: #3b2c09;
                border-color: #8a6a12;
                color: #fcd34d;
            }
            .qtai-chatbot-app.qtai-dark .qtai-chatbot-quota-badge.is-empty {
                background: #401515;
                border-color: #8c2020;
                color: #fca5a5;
            }
            .qtai-chatbot-app.qtai-dark .qtai-chatbot-compose-slot > .qtai-chatbot-quota-badge {
                box-shadow: 0 2px 12px rgba(0, 0, 0, 0.45);
            }
            .qtai-chatbot-badge.qtai-tier-free {
                background: #FFF7ED;
                color: #C2410C;
                border-color: #FDBA74;
            }
            .qtai-chatbot-badge.qtai-tier-pro {
                background: #ECFDF5;
                color: #047857;
                border-color: #6EE7B7;
            }
            /* Banner mời NÂNG CẤP khi gói dùng thử đã hết hạn — nằm ngay trên ô nhập. */
            .qtai-chatbot-trial-upsell {
                width: fit-content;
                max-width: 92%;
                margin: 0 auto 10px;
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 10px;
                flex-wrap: wrap;
                padding: 9px 14px;
                border: 1px solid #6EE7B7;
                border-radius: 12px;
                background: #ECFDF5;
                color: #047857;
                font-size: 12.5px;
                font-weight: 600;
                text-align: center;
                box-shadow: 0 2px 12px rgba(4, 120, 87, 0.16);
                animation: qtaiComposeChipIn 0.24s cubic-bezier(0.22, 1, 0.36, 1) both;
            }
            .qtai-chatbot-trial-upsell .qtai-chatbot-trial-upsell-btn {
                display: inline-block;
                padding: 6px 12px;
                border-radius: 999px;
                background: #059669;
                color: #fff;
                text-decoration: none;
                font-weight: 700;
                white-space: nowrap;
            }
            .qtai-chatbot-trial-upsell .qtai-chatbot-trial-upsell-btn:hover { background: #047857; }
            .qtai-chatbot-app.qtai-dark .qtai-chatbot-trial-upsell {
                background: #06281f;
                border-color: #0f5132;
                color: #6ee7b7;
                box-shadow: 0 2px 12px rgba(0, 0, 0, 0.45);
            }
            .qtai-chatbot-app.qtai-dark .qtai-chatbot-trial-upsell .qtai-chatbot-trial-upsell-btn {
                background: #059669;
                color: #fff;
            }
            .qtai-chatbot-body {
                display: flex;
                flex-direction: row;
                align-items: stretch;
                width: 100%;
                flex: 1 1 auto;
                min-height: 0;
                height: auto;
                max-height: none;
                overflow: hidden;
            }
            /* Chỉ xếp chồng dọc ở màn hình rất hẹp (điện thoại). Từ 600px trở lên
               vẫn giữ 2 cột (sidebar trái + khung chat) giống ChatGPT. */
            @media (max-width: 600px) {
                .qtai-chatbot-body {
                    flex-direction: column;
                    flex: 1 1 auto;
                    min-height: 0;
                    overflow: hidden;
                }
            }
            .qtai-chatbot-history {
                flex: 0 0 var(--qtai-sidebar-w);
                width: var(--qtai-sidebar-w);
                min-width: var(--qtai-sidebar-w);
                background: var(--qtai-paper-deep);
                border-right: 1px solid var(--qtai-border-light);
                display: flex;
                flex-direction: column;
                min-height: 0;
                overflow: hidden;
            }
            .qtai-chatbot-history-head {
                padding: 14px 14px 12px;
                border-bottom: 1px solid var(--qtai-border-light);
                background: var(--qtai-paper);
                flex-shrink: 0;
				display: flex;
                flex-direction: column;
                gap: 10px;
            }
            .qtai-chatbot-history-head h3 { margin: 0; font-size: 14px; font-weight: 700; color: var(--qtai-tea); }
            .qtai-chatbot-history-brand-row {
                display: flex;
                align-items: center;
                justify-content: space-between;
                gap: 8px;
            }
            .qtai-chatbot-history-brand {
                display: flex;
                align-items: center;
                gap: 10px;
                margin: 0;
                flex: 1;
                min-width: 0;
            }
            .qtai-chatbot-home-btn {
                flex-shrink: 0;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                gap: 4px;
                padding: 10px 9px;
                border: 1px solid var(--qtai-tea-border);
                border-radius: 8px;
                background: var(--qtai-white);
                color: var(--qtai-tea);
                font-size: 11px;
                font-weight: 700;
                text-decoration: none;
                line-height: 1.2;
                white-space: nowrap;
                font-family: inherit;
                transition: background 0.15s, border-color 0.15s;
            }
            .qtai-chatbot-home-btn:hover {
                background: var(--qtai-tea-bg);
                border-color: var(--qtai-tea-light);
                color: var(--qtai-tea);
                text-decoration: none;
            }
            /* Biến thể icon logo (gọn, đỡ tốn diện tích) */
            .qtai-chatbot-home-icon {
                padding: 5px;
                gap: 0;
                width: 38px;
                height: 38px;
            }
            .qtai-chatbot-home-icon img {
                width: 26px;
                height: 26px;
                object-fit: contain;
                display: block;
            }
            .qtai-chatbot-history-brand img {
                width: 32px;
                height: 32px;
                object-fit: contain;
                flex-shrink: 0;
            }
            /* Logo bên trái là link về trang chủ, mang luôn khung viền của nút "Trang chủ" cũ.
               Khung/nền/kích thước lấy từ .qtai-chatbot-home-btn + .qtai-chatbot-home-icon;
               ở đây chỉ chặn phần trang trí link mà theme (Flatsome) hay chèn vào thẻ a. */
            .qtai-chatbot-history-brand a.qtai-chatbot-brand-home {
                line-height: 0;
                text-decoration: none !important;
                box-shadow: none;
            }
            .qtai-chatbot-history-brand a.qtai-chatbot-brand-home:hover,
            .qtai-chatbot-history-brand a.qtai-chatbot-brand-home:focus {
                text-decoration: none !important;
            }
            /* Thắng .qtai-chatbot-history-brand img (32px) — trong khung viền thì ảnh 26px
               mới vừa, đúng như nút cũ. Hai selector kia cùng độ ưu tiên nên phải cụ thể hơn. */
            .qtai-chatbot-history-brand a.qtai-chatbot-brand-home img {
                width: 26px;
                height: 26px;
                object-fit: contain;
                display: block;
            }
            .qtai-chatbot-history-brand span {
                font-size: 15px;
                font-weight: 800;
                color: var(--qtai-brand-text);
                letter-spacing: 0.01em;
                line-height: 1.2;
            }
            /* Mục menu sidebar kiểu ChatGPT: không viền, không nền, chỉ hover mới sáng lên */
            .qtai-chatbot-new-chat-btn {
                width: 100%;
                min-width: 0;
                margin-top: 0;
                border: none;
                background: transparent;
                color: var(--qtai-ink);
                border-radius: 8px;
                padding: 9px 10px;
                font-size: 14px;
                font-weight: 400;
                letter-spacing: normal;
                text-transform: none;
                cursor: pointer;
                font-family: inherit;
                display: flex;
                align-items: center;
                justify-content: flex-start;
                text-align: left;
                gap: 10px;
                line-height: 1.4;
                box-shadow: none;
                transition: background .15s ease, color .15s ease;
            }
            .qtai-chatbot-new-chat-btn:hover {
                background: var(--qtai-paper-deep);
                color: var(--qtai-ink);
            }
            /* "Về trang chủ" là thẻ <a> chứ không phải <button> nên .qtai-chatbot-new-chat-btn
               ở trên không thắng nổi luật cho link của theme (màu + gạch chân) — ép lại. */
            .qtai-chatbot-app a.qtai-chatbot-home-link,
            .qtai-chatbot-app a.qtai-chatbot-home-link:hover,
            .qtai-chatbot-app a.qtai-chatbot-home-link:focus {
                color: var(--qtai-ink) !important;
                text-decoration: none !important;
                box-shadow: none !important;
                margin: 0 !important;
            }
            .qtai-chatbot-app a.qtai-chatbot-home-link:hover {
                background: var(--qtai-paper-deep);
            }
            /* display:flex ở trên ghi đè [hidden] của trình duyệt → phải ép lại,
               nếu không nút "Trở về..." sẽ luôn hiện dù đã đặt hidden. */
            .qtai-chatbot-new-chat-btn[hidden],
            .qtai-chatbot-new-folder-btn[hidden] {
                display: none !important;
            }
            /* Kiểu ChatGPT: mỗi mục một dòng, icon + chữ, không viền/nền */
            .qtai-chatbot-history-actions {
                display: flex;
                flex-direction: column;
                gap: 2px;
            }
            .qtai-chatbot-btn-ic {
                flex: 0 0 18px;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                color: var(--qtai-ink-muted);
            }
            .qtai-chatbot-btn-ic svg { display: block; }
            .qtai-chatbot-new-folder-btn {
                width: 100%;
                min-width: 0;
                border: none;
                background: transparent;
                color: var(--qtai-ink);
                border-radius: 8px;
                padding: 9px 10px;
                font-size: 14px;
                font-weight: 400;
                letter-spacing: normal;
                text-transform: none;
                cursor: pointer;
                font-family: inherit;
                display: flex;
                align-items: center;
                justify-content: flex-start;
                text-align: left;
                gap: 10px;
                line-height: 1.4;
                box-shadow: none;
                transition: background .15s ease, color .15s ease;
            }
            .qtai-chatbot-new-folder-btn:hover {
                background: var(--qtai-paper-deep);
                color: var(--qtai-ink);
            }
            /* ===== Nút "Dự án" ở sidebar (kèm dấu +) ===== */
            .qtai-chatbot-projects-nav {
                display: flex;
                align-items: center;
                gap: 2px;
            }
            .qtai-chatbot-projects-nav > .qtai-chatbot-new-folder-btn { flex: 1 1 auto; }
            .qtai-chatbot-projects-count {
                flex: none;
                font-size: 12px;
                color: var(--qtai-ink-muted);
            }
            .qtai-chatbot-projects-add {
                flex: none;
                border: none;
                background: transparent;
                color: var(--qtai-ink-muted);
                border-radius: 8px;
                padding: 7px;
                cursor: pointer;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                font-family: inherit;
                transition: background .15s ease, color .15s ease;
            }
            .qtai-chatbot-projects-add:hover {
                background: var(--qtai-paper-deep);
                color: var(--qtai-ink);
            }
            .qtai-chatbot-projects-add svg { display: block; }
            /* Đang duyệt dự án → ẩn hero, khung hội thoại và ô nhập */
            .qtai-chatbot-app.qtai-projects-open .qtai-chatbot-hero,
            .qtai-chatbot-app.qtai-projects-open .qtai-chatbot-conversation,
            .qtai-chatbot-app.qtai-projects-open .qtai-chatbot-compose-slot {
                display: none !important;
            }
            /* ===== Trang "Dự án" ở vùng giữa ===== */
            .qtai-chatbot-projects-view {
                position: absolute;
                inset: 0;
                z-index: 5;
                background: var(--qtai-paper);
                overflow-y: auto;
            }
            .qtai-chatbot-projects-view[hidden] { display: none; }
            .qtai-chatbot-projects-inner {
                max-width: 880px;
                margin: 0 auto;
                padding: 48px 28px 40px;
            }
            .qtai-chatbot-projects-head {
                display: flex;
                align-items: center;
                justify-content: space-between;
                gap: 16px;
                flex-wrap: wrap;
                margin-bottom: 28px;
            }
            .qtai-chatbot-projects-head h2 {
                margin: 0;
                font-size: 26px;
                font-weight: 700;
                color: var(--qtai-ink);
            }
            .qtai-chatbot-projects-head-actions {
                display: flex;
                align-items: center;
                gap: 10px;
            }
            .qtai-chatbot-projects-search-wrap {
                display: flex;
                align-items: center;
                gap: 8px;
                border: 1px solid var(--qtai-border);
                border-radius: 999px;
                padding: 8px 14px;
                background: var(--qtai-white);
                color: var(--qtai-ink-muted);
            }
            .qtai-chatbot-projects-search-wrap input {
                border: none;
                outline: none;
                background: transparent;
                font-family: inherit;
                font-size: 14px;
                color: var(--qtai-ink);
                width: 170px;
            }
            .qtai-chatbot-projects-create-btn {
                border: none;
                background: var(--qtai-ink);
                color: var(--qtai-white);
                border-radius: 999px;
                padding: 10px 22px;
                font-size: 14px;
                font-weight: 600;
                font-family: inherit;
                cursor: pointer;
                transition: filter .15s ease;
            }
            .qtai-chatbot-projects-create-btn:hover { filter: brightness(1.25); }
            .qtai-chatbot-projects-table-head,
            .qtai-chatbot-projects-row {
                display: grid;
                grid-template-columns: 1fr 150px;
                align-items: center;
                gap: 12px;
            }
            .qtai-chatbot-projects-table-head {
                padding: 0 12px 10px;
                font-size: 13px;
                color: var(--qtai-ink-muted);
                border-bottom: 1px solid var(--qtai-border-light);
            }
            .qtai-chatbot-projects-row {
                width: 100%;
                border: none;
                background: transparent;
                border-radius: 10px;
                padding: 14px 12px;
                cursor: pointer;
                font-family: inherit;
                font-size: 15px;
                color: var(--qtai-ink);
                text-align: left;
                transition: background .15s ease;
            }
            .qtai-chatbot-projects-row:hover { background: var(--qtai-paper-deep); }
            .qtai-chatbot-projects-row-name {
                display: flex;
                align-items: center;
                gap: 12px;
                min-width: 0;
            }
            .qtai-chatbot-projects-row-name span:last-child {
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }
            .qtai-chatbot-projects-row-date {
                font-size: 14px;
                color: var(--qtai-ink-muted);
            }
            .qtai-chatbot-projects-empty {
                padding: 60px 12px;
                text-align: center;
                color: var(--qtai-ink-muted);
                font-size: 15px;
            }
            /* Chi tiết dự án */
            .qtai-chatbot-project-detail-head {
                display: flex;
                align-items: center;
                gap: 12px;
                margin-bottom: 24px;
            }
            .qtai-chatbot-project-detail-head h2 {
                flex: 1 1 auto;
                min-width: 0;
                margin: 0;
                font-size: 24px;
                font-weight: 700;
                color: var(--qtai-ink);
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }
            .qtai-chatbot-project-back {
                flex: none;
                border: none;
                background: transparent;
                color: var(--qtai-ink-muted);
                border-radius: 8px;
                padding: 6px;
                cursor: pointer;
                display: inline-flex;
                transition: background .15s ease, color .15s ease;
            }
            .qtai-chatbot-project-back:hover {
                background: var(--qtai-paper-deep);
                color: var(--qtai-ink);
            }
            .qtai-chatbot-project-newchat {
                flex: none;
                border: 1px solid var(--qtai-border);
                background: var(--qtai-white);
                color: var(--qtai-ink);
                border-radius: 999px;
                padding: 8px 16px;
                font-size: 13px;
                font-weight: 600;
                font-family: inherit;
                cursor: pointer;
                transition: background .15s ease;
            }
            .qtai-chatbot-project-newchat:hover { background: var(--qtai-paper-deep); }
            .qtai-chatbot-project-chat-row {
                display: grid;
                grid-template-columns: 1fr 110px;
                align-items: center;
                gap: 12px;
                width: 100%;
                border: none;
                background: transparent;
                border-radius: 10px;
                padding: 13px 12px;
                cursor: pointer;
                font-family: inherit;
                font-size: 15px;
                color: var(--qtai-ink);
                text-align: left;
                transition: background .15s ease;
            }
            .qtai-chatbot-project-chat-row:hover { background: var(--qtai-paper-deep); }
            .qtai-chatbot-project-chat-row span:first-child {
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }
            .qtai-chatbot-project-chat-date {
                font-size: 13px;
                color: var(--qtai-ink-muted);
            }
            @media (max-width: 600px) {
                .qtai-chatbot-projects-inner { padding: 24px 14px 32px; }
                .qtai-chatbot-projects-head h2 { font-size: 22px; }
                .qtai-chatbot-projects-search-wrap input { width: 120px; }
                .qtai-chatbot-projects-table-head,
                .qtai-chatbot-projects-row { grid-template-columns: 1fr 100px; }
            }
            /* ===== CHỐNG THEME (Flatsome) cho phần Dự án =====
               Theme áp style lên mọi input/button/heading: chữ hoa, viền, chiều cao tối thiểu,
               bo góc, margin-bottom... nên phải ép lại bằng selector đủ mạnh + !important. */
            .qtai-chatbot-app .qtai-chatbot-projects-view h2 {
                margin: 0 !important;
                padding: 0 !important;
                font-family: inherit !important;
                letter-spacing: normal !important;
                text-transform: none !important;
                line-height: 1.25 !important;
                color: var(--qtai-ink) !important;
            }
            .qtai-chatbot-app .qtai-chatbot-projects-head h2 { font-size: 26px !important; }
            .qtai-chatbot-app .qtai-chatbot-project-detail-head h2 { font-size: 24px !important; }
            .qtai-chatbot-app .qtai-chatbot-projects-search-wrap {
                min-height: 0 !important;
            }
            .qtai-chatbot-app input[type="text"].qtai-chatbot-projects-search-input,
            .qtai-chatbot-app .qtai-chatbot-projects-search-wrap input {
                border: none !important;
                outline: none !important;
                background: transparent !important;
                box-shadow: none !important;
                margin: 0 !important;
                padding: 0 !important;
                height: auto !important;
                min-height: 0 !important;
                border-radius: 0 !important;
                font-family: inherit !important;
                font-size: 14px !important;
                line-height: 1.4 !important;
                color: var(--qtai-ink) !important;
                text-transform: none !important;
                letter-spacing: normal !important;
                width: 170px !important;
                max-width: 100% !important;
            }
            .qtai-chatbot-app button.qtai-chatbot-projects-create-btn {
                border: none !important;
                background: var(--qtai-ink) !important;
                color: var(--qtai-white) !important;
                border-radius: 999px !important;
                padding: 10px 22px !important;
                margin: 0 !important;
                min-height: 0 !important;
                height: auto !important;
                box-shadow: none !important;
                font-family: inherit !important;
                font-size: 14px !important;
                font-weight: 600 !important;
                line-height: 1.2 !important;
                text-transform: none !important;
                letter-spacing: normal !important;
            }
            .qtai-chatbot-app button.qtai-chatbot-projects-row,
            .qtai-chatbot-app button.qtai-chatbot-project-chat-row {
                border: none !important;
                background: transparent !important;
                color: var(--qtai-ink) !important;
                border-radius: 10px !important;
                margin: 0 !important;
                min-height: 0 !important;
                height: auto !important;
                box-shadow: none !important;
                font-family: inherit !important;
                font-size: 15px !important;
                font-weight: 400 !important;
                line-height: 1.4 !important;
                text-transform: none !important;
                letter-spacing: normal !important;
                text-align: left !important;
            }
            .qtai-chatbot-app button.qtai-chatbot-projects-row:hover,
            .qtai-chatbot-app button.qtai-chatbot-project-chat-row:hover {
                background: var(--qtai-paper-deep) !important;
            }
            .qtai-chatbot-app button.qtai-chatbot-project-back {
                border: none !important;
                background: transparent !important;
                color: var(--qtai-ink-muted) !important;
                border-radius: 8px !important;
                padding: 6px !important;
                margin: 0 !important;
                min-height: 0 !important;
                box-shadow: none !important;
            }
            .qtai-chatbot-app button.qtai-chatbot-project-newchat {
                border: 1px solid var(--qtai-border) !important;
                background: var(--qtai-white) !important;
                color: var(--qtai-ink) !important;
                border-radius: 999px !important;
                padding: 8px 16px !important;
                margin: 0 !important;
                min-height: 0 !important;
                height: auto !important;
                box-shadow: none !important;
                font-family: inherit !important;
                font-size: 13px !important;
                font-weight: 600 !important;
                line-height: 1.2 !important;
                text-transform: none !important;
                letter-spacing: normal !important;
            }
            /* Modal "Tạo dự án" cũng bị theme đụng vào */
            .qtai-chatbot-app .qtai-chatbot-folder-modal-card h4 {
                margin: 0 !important;
                padding: 0 !important;
                font-family: inherit !important;
                font-size: 17px !important;
                line-height: 1.3 !important;
                text-transform: none !important;
                letter-spacing: normal !important;
                color: var(--qtai-ink) !important;
            }
            .qtai-chatbot-app .qtai-chatbot-folder-create input[type="text"] {
                width: 100% !important;
                border: 1px solid var(--qtai-border) !important;
                border-radius: 10px !important;
                padding: 11px 12px !important;
                margin: 0 !important;
                height: auto !important;
                min-height: 0 !important;
                background: var(--qtai-white) !important;
                color: var(--qtai-ink) !important;
                box-shadow: none !important;
                font-family: inherit !important;
                font-size: 14px !important;
                line-height: 1.4 !important;
                text-transform: none !important;
                letter-spacing: normal !important;
            }
            .qtai-chatbot-app button.qtai-chatbot-folder-create-btn {
                border: 1px solid var(--qtai-tea) !important;
                background: var(--qtai-tea) !important;
                color: #fff !important;
                border-radius: 999px !important;
                padding: 10px 20px !important;
                margin: 0 !important;
                min-height: 0 !important;
                height: auto !important;
                box-shadow: none !important;
                font-family: inherit !important;
                font-size: 14px !important;
                font-weight: 600 !important;
                line-height: 1.2 !important;
                text-transform: none !important;
                letter-spacing: normal !important;
            }
            .qtai-chatbot-app button.qtai-chatbot-folder-cancel-btn {
                border: none !important;
                background: transparent !important;
                color: var(--qtai-ink-muted) !important;
                border-radius: 8px !important;
                padding: 2px 6px !important;
                margin: 0 !important;
                min-height: 0 !important;
                box-shadow: none !important;
                font-size: 22px !important;
                line-height: 1 !important;
            }
            /* ===== Modal "Tạo dự án" ===== */
            .qtai-chatbot-folder-create {
                display: none;
                position: fixed;
                inset: 0;
                z-index: 2147483000;
                align-items: center;
                justify-content: center;
                padding: 16px;
            }
            .qtai-chatbot-folder-create.is-open { display: flex; }
            .qtai-chatbot-folder-modal-backdrop {
                position: absolute;
                inset: 0;
                background: rgba(15, 23, 42, 0.45);
            }
            .qtai-chatbot-folder-modal-card {
                position: relative;
                width: 100%;
                max-width: 460px;
                background: var(--qtai-white);
                border: 1px solid var(--qtai-border-light);
                border-radius: 16px;
                box-shadow: 0 24px 60px rgba(15, 23, 42, 0.28);
                padding: 18px 20px 16px;
            }
            .qtai-chatbot-folder-modal-head {
                display: flex;
                align-items: center;
                justify-content: space-between;
                gap: 10px;
                margin-bottom: 14px;
            }
            .qtai-chatbot-folder-modal-head h4 {
                margin: 0;
                font-size: 17px;
                font-weight: 700;
                color: var(--qtai-ink);
            }
            .qtai-chatbot-folder-modal-label {
                display: block;
                margin-bottom: 6px;
                font-size: 13px;
                font-weight: 600;
                color: var(--qtai-ink);
            }
            .qtai-chatbot-folder-create input {
                width: 100%;
                box-sizing: border-box;
                border: 1px solid var(--qtai-border);
                border-radius: 10px;
                padding: 11px 12px;
                font-size: 14px;
                font-family: inherit;
                color: var(--qtai-ink);
                background: var(--qtai-white);
            }
            .qtai-chatbot-folder-create input:focus {
                outline: none;
                border-color: var(--qtai-tea-light);
                box-shadow: 0 0 0 3px rgba(13, 148, 136, 0.14);
            }
            .qtai-chatbot-folder-modal-hint {
                display: flex;
                align-items: flex-start;
                gap: 10px;
                margin-top: 14px;
                padding: 12px;
                border-radius: 12px;
                background: var(--qtai-paper-deep);
                font-size: 13px;
                line-height: 1.5;
                color: var(--qtai-ink-muted);
            }
            .qtai-chatbot-folder-modal-foot {
                display: flex;
                justify-content: flex-end;
                margin-top: 16px;
            }
            .qtai-chatbot-folder-create-btn {
                border: 1px solid var(--qtai-tea);
                background: var(--qtai-tea);
                color: #fff;
                border-radius: 999px;
                padding: 10px 20px;
                font-size: 14px;
                font-weight: 600;
                cursor: pointer;
                font-family: inherit;
                white-space: nowrap;
                transition: filter .15s ease;
            }
            .qtai-chatbot-folder-create-btn:hover { filter: brightness(1.08); }
            .qtai-chatbot-folder-cancel-btn {
                flex: none;
                border: none;
                background: transparent;
                color: var(--qtai-ink-muted);
                border-radius: 8px;
                padding: 2px 6px;
                font-size: 22px;
                line-height: 1;
                cursor: pointer;
                font-family: inherit;
                transition: background .15s ease, color .15s ease;
            }
            .qtai-chatbot-folder-cancel-btn:hover {
                background: var(--qtai-paper-deep);
                color: var(--qtai-ink);
            }
            .qtai-chatbot-history-section-label {
                font-size: 11px;
                font-weight: 700;
                letter-spacing: 0.04em;
                text-transform: uppercase;
                color: var(--qtai-ink-muted);
                padding: 10px 4px 6px;
            }
            .qtai-chatbot-history-folders-wrap {
                flex-shrink: 0;
            }
            .qtai-chatbot-history-folders-wrap.is-hidden {
                display: none;
            }
            .qtai-chatbot-history-folders {
                display: flex;
                flex-direction: column;
                gap: 4px;
                max-height: 148px;
                overflow-y: auto;
                padding-right: 2px;
            }
            .qtai-chatbot-history-folder-row {
                display: flex;
                align-items: center;
                gap: 4px;
            }
            .qtai-chatbot-history-folder-pill,
            .qtai-chatbot-app button.qtai-chatbot-history-folder-pill {
                flex: 1;
                min-width: 0;
                border: 1px solid var(--qtai-border-light);
                background: var(--qtai-white);
                color: var(--qtai-ink);
                border-radius: 8px;
                padding: 9px 10px;
                font-size: 12px;
                font-weight: 600;
                letter-spacing: .04em;
                text-transform: uppercase;
                cursor: pointer;
                font-family: inherit;
                display: flex;
                align-items: center;
                gap: 8px;
                text-align: left;
                box-shadow: none;
                transition: background .15s ease, border-color .15s ease, color .15s ease;
            }
            .qtai-chatbot-history-folder-pill:hover,
            .qtai-chatbot-app button.qtai-chatbot-history-folder-pill:hover {
                background: var(--qtai-paper-deep);
                border-color: var(--qtai-border);
            }
            /* Thư mục đang chọn: giữ một dấu hiệu nhẹ để phân biệt, không loè loẹt */
            .qtai-chatbot-history-folder-pill.is-active,
            .qtai-chatbot-app button.qtai-chatbot-history-folder-pill.is-active {
                background: var(--qtai-paper-deep);
                border-color: var(--qtai-tea-border);
                color: var(--qtai-tea);
            }
            .qtai-chatbot-history-folder-pill-name {
                flex: 1;
                min-width: 0;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }
            .qtai-chatbot-history-folder-pill-count {
                font-size: 11px;
                font-weight: 600;
                color: var(--qtai-ink-muted);
                flex-shrink: 0;
            }
            .qtai-chatbot-history-folder-pill.is-active .qtai-chatbot-history-folder-pill-count {
                color: #0d9488;
            }
            .qtai-chatbot-history-folder-pill-delete,
            .qtai-chatbot-app button.qtai-chatbot-history-folder-pill-delete {
                border: none;
                background: transparent;
                color: var(--qtai-ink-muted);
                width: 28px;
                height: 32px;
                border-radius: 6px;
                cursor: pointer;
                font-size: 15px;
                line-height: 1;
                padding: 0;
                flex-shrink: 0;
            }
            .qtai-chatbot-history-folder-row:hover .qtai-chatbot-history-folder-pill-delete,
            .qtai-chatbot-history-folder-pill-delete:focus {
                opacity: 1;
            }
            .qtai-chatbot-history-folder-pill-delete:hover {
                background: #fee2e2;
                color: #b91c1c;
            }
            .qtai-chatbot-history-list-context {
                font-size: 11px;
                font-weight: 700;
                letter-spacing: 0.04em;
                text-transform: uppercase;
                color: var(--qtai-ink-muted);
                padding: 8px 4px 6px;
            }
            .qtai-chatbot-history-item-move,
            .qtai-chatbot-history-item-pin,
            .qtai-chatbot-history-item-rename,
            .qtai-chatbot-app button.qtai-chatbot-history-item-move,
            .qtai-chatbot-app button.qtai-chatbot-history-item-pin,
            .qtai-chatbot-app button.qtai-chatbot-history-item-rename {
                border: none;
                background: transparent;
                color: var(--qtai-ink-muted);
                width: 24px;
                height: 24px;
                border-radius: 6px;
                cursor: pointer;
                opacity: 0;
                font-size: 13px;
                line-height: 1;
                padding: 0;
            }
            .qtai-chatbot-history-item:hover .qtai-chatbot-history-item-move,
            .qtai-chatbot-history-item:hover .qtai-chatbot-history-item-pin,
            .qtai-chatbot-history-item:hover .qtai-chatbot-history-item-rename,
            .qtai-chatbot-history-item-move:focus,
            .qtai-chatbot-history-item-pin:focus,
            .qtai-chatbot-history-item-rename:focus { opacity: 1; }
            .qtai-chatbot-history-item.is-pinned .qtai-chatbot-history-item-pin { opacity: 1; }
            .qtai-chatbot-app .qtai-chatbot-history-rename-input,
            .qtai-chatbot-app input.qtai-chatbot-history-rename-input {
                -webkit-appearance: none !important;
                appearance: none !important;
                display: block !important;
                width: 100% !important;
                box-sizing: border-box !important;
                margin: 2px 0 !important;
                padding: 11px 12px !important;
                border: 2px solid var(--qtai-accent) !important;
                border-radius: 12px !important;
                font-family: inherit !important;
                font-size: 13px !important;
                font-weight: 600 !important;
                line-height: 1.3 !important;
                height: auto !important;
                min-height: 0 !important;
                color: var(--qtai-ink) !important;
                background: var(--qtai-white) !important;
                outline: none !important;
                box-shadow: 0 0 0 3px rgba(13, 148, 136, 0.16) !important;
            }
            .qtai-chatbot-app .qtai-chatbot-history-rename-input::placeholder {
                color: var(--qtai-ink-muted);
                font-weight: 400;
            }
            .qtai-chatbot-history-item-move:hover,
            .qtai-chatbot-history-item-pin:hover,
            .qtai-chatbot-history-item-rename:hover {
                background: #e2e8f0;
                color: #334155;
            }
            .qtai-chatbot-history-move-menu {
                position: fixed;
                z-index: 2147483651;
                min-width: 180px;
                max-width: 240px;
                background: #fff;
                border: 1px solid #e2e8f0;
                border-radius: 10px;
                box-shadow: 0 10px 30px rgba(15, 23, 42, 0.14);
                padding: 6px;
            }
            .qtai-chatbot-history-move-menu-title {
                font-size: 11px;
                font-weight: 700;
                color: var(--qtai-ink-muted);
                padding: 6px 8px 4px;
                text-transform: uppercase;
                letter-spacing: 0.04em;
            }
            .qtai-chatbot-history-move-menu-item {
                width: 100%;
                border: none;
                background: transparent;
                text-align: left;
                padding: 8px 10px;
                border-radius: 8px;
                font-size: 13px;
                color: #334155;
                cursor: pointer;
                font-family: inherit;
            }
            .qtai-chatbot-history-move-menu-item:hover { background: #f1f5f9; }
            .qtai-chatbot-history-move-menu-item.is-active {
                background: #ecfdf5;
                color: #0f766e;
                font-weight: 600;
            }
            .qtai-chatbot-history-search-btn,
            .qtai-chatbot-app button.qtai-chatbot-history-search-btn {
                width: 100%;
                display: flex;
                align-items: center;
                gap: 10px;
                border: none !important;
                border-radius: 8px !important;
                padding: 9px 10px !important;
                min-height: 0 !important;
                background: transparent !important;
                color: var(--qtai-ink);
                font-size: 14px !important;
                font-weight: 400 !important;
                text-transform: none !important;
                letter-spacing: normal !important;
                line-height: 1.4 !important;
                font-family: inherit;
                cursor: pointer;
                box-shadow: none !important;
                text-align: left !important;
                transition: background .15s ease, color .15s ease;
            }
            .qtai-chatbot-app button.qtai-chatbot-history-search-btn:hover {
                background: var(--qtai-paper-deep) !important;
                color: var(--qtai-ink);
            }
            /* flex 18px giống .qtai-chatbot-btn-ic của 2 dòng trên — icon kính lúp chỉ 16px,
               để 'auto' là cột chữ của dòng này lệch trái 2px so với 2 dòng kia. */
            .qtai-chatbot-history-search-btn-ic { display: inline-flex; align-items: center; justify-content: center; color: var(--qtai-ink-muted); flex: 0 0 18px; }
            .qtai-chatbot-history-search,
            .qtai-chatbot-app .qtai-chatbot-history-search,
            .qtai-chatbot-app input.qtai-chatbot-history-search[type="search"] {
                margin-top: 10px;
                width: 100%;
                border: 1px solid var(--qtai-border) !important;
                border-radius: 999px !important;
                padding: 9px 14px !important;
                height: auto !important;
                min-height: 0 !important;
                line-height: 1.4 !important;
                font-size: 12px !important;
                font-family: inherit;
                background: var(--qtai-white) !important;
                outline: none !important;
                box-shadow: none !important;
                -webkit-appearance: none !important;
                appearance: none !important;
                box-sizing: border-box !important;
                transition: border-color 0.15s, box-shadow 0.15s;
            }
            .qtai-chatbot-history-search:focus,
            .qtai-chatbot-app .qtai-chatbot-history-search:focus,
            .qtai-chatbot-app input.qtai-chatbot-history-search[type="search"]:focus {
                border-color: var(--qtai-accent) !important;
                border-radius: 999px !important;
                box-shadow: 0 0 0 2px rgba(13, 148, 136, 0.12) !important;
                outline: none !important;
            }
            .qtai-chatbot-history-label {
                margin: 12px 0 6px;
                padding: 0 4px;
                font-size: 11px;
                font-weight: 700;
                color: var(--qtai-ink-muted);
                text-transform: uppercase;
                letter-spacing: 0.04em;
            }
            .qtai-chatbot-history-list {
                flex: 1 1 auto;
                min-height: 0;
                overflow-y: auto;
                padding: 4px 8px 10px;
                display: flex;
                flex-direction: column;
                gap: 2px;
                scrollbar-width: thin;
            }
            /* ===== Account footer (đáy sidebar trái, kiểu ChatGPT) ===== */
            .qtai-chatbot-account {
                position: relative;
                flex-shrink: 0;
                padding: 8px;
                border-top: 1px solid var(--qtai-border-light);
                background: var(--qtai-paper);
            }
            .qtai-chatbot-account-btn {
                display: flex; align-items: center; gap: 10px; width: 100%;
                padding: 8px 10px; border: 1px solid var(--qtai-border-light);
                border-radius: 12px; background: var(--qtai-paper-deep);
                cursor: pointer; text-align: left; color: var(--qtai-ink);
                transition: background .15s, border-color .15s;
            }
            .qtai-chatbot-account-btn:hover { background: var(--qtai-paper); border-color: var(--qtai-tea); }
            .qtai-chatbot-account-avatar {
                flex: 0 0 32px; width: 32px; height: 32px; border-radius: 50%;
                background: var(--qtai-brand); color: #fff; font-weight: 700; font-size: 14px;
                display: flex; align-items: center; justify-content: center;
            }
            .qtai-chatbot-account-info { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; line-height: 1.25; }
            .qtai-chatbot-account-name { font-size: 13px; font-weight: 700; color: var(--qtai-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
            .qtai-chatbot-account-plan { font-size: 11px; color: var(--qtai-brand-text); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
            .qtai-chatbot-account-caret { flex: 0 0 auto; color: #94a3b8; font-size: 12px; }
            .qtai-chatbot-account-login { text-decoration: none; }
            .qtai-chatbot-account-menu {
                position: absolute; left: 8px; right: 8px; bottom: calc(100% - 2px);
                background: var(--qtai-paper); border: 1px solid var(--qtai-border-light);
                border-radius: 14px; box-shadow: 0 -8px 30px rgba(0,0,0,.14);
                padding: 6px; z-index: 40;
            }
            .qtai-chatbot-account-menu[hidden] { display: none; }
            .qtai-chatbot-account-menu-head { display: flex; align-items: center; gap: 10px; padding: 8px; }
            .qtai-chatbot-account-meta { min-width: 0; }
            .qtai-chatbot-account-menu-head strong { display: block; font-size: 13px; color: var(--qtai-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
            .qtai-chatbot-account-menu-head small { display: block; font-size: 11px; color: #94a3b8; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
            .qtai-chatbot-account-plan-row { font-size: 12px; color: var(--qtai-ink); padding: 0 8px 8px; }
            .qtai-chatbot-account-plan-row strong { color: var(--qtai-brand-text); }
            .qtai-chatbot-account-plan-hover { position: relative; padding-bottom: 8px; }
            .qtai-chatbot-account-plan-trigger { cursor: default; display: flex; align-items: center; gap: 4px; padding: 4px; border-radius: 6px; user-select: none; }
            .qtai-chatbot-account-plan-hover:hover .qtai-chatbot-account-plan-trigger { background: var(--qtai-border-light); }
            .qtai-chatbot-account-plan-caret { margin-left: auto; font-size: 13px; color: #94a3b8; }
            /* Submenu NỔI bay sang phải khi rê chuột. Dùng position:fixed + JS đặt toạ độ
               để THOÁT overflow:hidden của sidebar (nếu absolute sẽ bị cắt cụt). */
            .qtai-chatbot-account-plan-list {
                position: fixed; left: 0; top: 0; min-width: 170px;
                list-style: none; margin: 0; padding: 6px;
                background: var(--qtai-paper); border: 1px solid var(--qtai-border-light);
                border-radius: 12px; box-shadow: 0 8px 30px rgba(0,0,0,.18);
                z-index: 70; opacity: 0; visibility: hidden; transform: translateX(-6px);
                transition: opacity .15s ease, transform .15s ease, visibility .15s;
                pointer-events: none;
            }
            .qtai-chatbot-account-plan-list.is-open { opacity: 1; visibility: visible; transform: translateX(0); pointer-events: auto; }
            .qtai-chatbot-account-plan-list li { position: relative; font-size: 12px; color: var(--qtai-ink); padding: 5px 8px 5px 20px; white-space: nowrap; border-radius: 6px; }
            .qtai-chatbot-account-plan-list li:hover { background: var(--qtai-border-light); }
            .qtai-chatbot-account-plan-list li::before { content: "•"; position: absolute; left: 7px; color: var(--qtai-brand-text); }
            .qtai-chatbot-account-divider { height: 1px; background: var(--qtai-border-light); margin: 4px 0; }
            .qtai-chatbot-account-item {
                display: flex; align-items: center; gap: 10px; width: 100%;
                padding: 9px 10px; border: 0; background: transparent; border-radius: 9px;
                font-size: 13px; color: var(--qtai-ink) !important; cursor: pointer; text-decoration: none !important; text-align: left;
            }
            .qtai-chatbot-account-item:hover,
            .qtai-chatbot-account-item:focus { background: var(--qtai-paper-deep); color: var(--qtai-ink) !important; text-decoration: none !important; }
            .qtai-chatbot-account-item-ic { flex: 0 0 18px; text-align: center; }
            .qtai-chatbot-account-item-ic svg {
                width: 16px;
                height: 16px;
                display: block;
                margin: 0 auto;
                stroke: currentColor;
                fill: none;
            }
            .qtai-chatbot-account-item.is-upgrade,
            .qtai-chatbot-account-item.is-upgrade:hover,
            .qtai-chatbot-account-item.is-upgrade:focus { color: #d97706 !important; font-weight: 600; }
            .qtai-chatbot-account-item.is-danger,
            .qtai-chatbot-account-item.is-danger:hover,
            .qtai-chatbot-account-item.is-danger:focus { color: #ef4444 !important; }
            .qtai-hist-skeleton {
                display: flex;
                flex-direction: column;
                gap: 8px;
                padding: 8px 4px 4px;
                flex: 0 0 auto;
            }
            .qtai-hist-skeleton span {
                display: block;
                height: 15px;
                border-radius: 6px;
                background: linear-gradient(90deg, rgba(127,127,127,0.10) 25%, rgba(127,127,127,0.22) 37%, rgba(127,127,127,0.10) 63%);
                background-size: 400% 100%;
                animation: qtaiHistShimmer 1.2s ease-in-out infinite;
            }
            .qtai-hist-skeleton span:nth-child(2) { width: 82%; }
            .qtai-hist-skeleton span:nth-child(3) { width: 60%; }
            @keyframes qtaiHistShimmer {
                0% { background-position: 100% 50%; }
                100% { background-position: 0 50%; }
            }
            /* ===== Modal tìm kiếm đoạn chat ===== */
            .qtai-search-modal-overlay {
                position: fixed;
                inset: 0;
                z-index: 100000;
                background: rgba(15, 23, 42, 0.45);
                display: flex;
                align-items: flex-start;
                justify-content: center;
                padding: 10vh 16px 16px;
                -webkit-backdrop-filter: blur(2px);
                backdrop-filter: blur(2px);
            }
            .qtai-search-modal-overlay[hidden] { display: none; }
            .qtai-search-modal {
                width: 100%;
                max-width: 640px;
                background: var(--qtai-white);
                border: 1px solid var(--qtai-border-light);
                border-radius: 16px;
                box-shadow: 0 24px 60px rgba(0, 0, 0, 0.28);
                display: flex;
                flex-direction: column;
                max-height: 70vh;
                overflow: hidden;
            }
            .qtai-search-modal-head {
                display: flex;
                align-items: center;
                gap: 10px;
                padding: 13px 16px;
                border-bottom: 1px solid var(--qtai-border-light);
            }
            .qtai-search-modal-ic {
                flex: 0 0 18px;
                height: 18px;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                color: var(--qtai-ink-muted);
            }
            .qtai-search-modal-ic svg { display: block; }
            .qtai-search-modal-input,
            .qtai-chatbot-app .qtai-search-modal-input,
            .qtai-chatbot-app input.qtai-search-modal-input[type="text"],
            .qtai-chatbot-app input.qtai-search-modal-input[type="text"]:focus {
                flex: 1 1 auto;
                border: none !important;
                outline: none !important;
                background: transparent !important;
                box-shadow: none !important;
                font-size: 16px;
                color: var(--qtai-ink) !important;
                font-family: inherit;
                padding: 0 !important;
                /* Theme (Flatsome) gắn margin-bottom cho input. Khối reset chung ở trên chỉ
                   dọn cho button/submit/textarea, KHÔNG dọn input[type=text] — còn margin đó
                   thì flex canh theo hộp-kèm-margin, chữ bị đẩy lên trên so với icon. */
                margin: 0 !important;
                line-height: 1.2 !important;
                -webkit-appearance: none !important;
                appearance: none !important;
            }
            .qtai-search-modal-close,
            .qtai-chatbot-app button.qtai-search-modal-close {
                border: none !important;
                background: transparent !important;
                cursor: pointer;
                font-size: 15px;
                color: var(--qtai-ink-muted);
                padding: 4px 8px !important;
                border-radius: 8px !important;
                min-height: 0 !important;
                box-shadow: none !important;
            }
            .qtai-search-modal-close:hover { background: var(--qtai-tea-bg) !important; color: var(--qtai-ink) !important; }
            .qtai-search-modal-results { overflow-y: auto; padding: 6px; }
            .qtai-search-hint { padding: 26px 16px; text-align: center; color: var(--qtai-ink-muted); font-size: 13px; }
            .qtai-search-result,
            .qtai-chatbot-app button.qtai-search-result {
                display: flex;
                align-items: flex-start;
                gap: 11px;
                width: 100%;
                text-align: left !important;
                padding: 10px 12px !important;
                border: none !important;
                background: transparent !important;
                border-radius: 10px !important;
                cursor: pointer;
                font-family: inherit;
                box-shadow: none !important;
                min-height: 0 !important;
                text-transform: none !important;
                letter-spacing: normal !important;
                line-height: 1.4 !important;
                font-weight: 400 !important;
            }
            .qtai-search-result:hover { background: var(--qtai-tea-bg) !important; }
            .qtai-search-result-ic { font-size: 15px; margin-top: 1px; flex: 0 0 auto; opacity: 0.7; }
            .qtai-search-result-body { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1 1 auto; }
            .qtai-search-result-title { font-size: 14px; font-weight: 600; color: var(--qtai-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
            .qtai-search-result-snippet {
                font-size: 12.5px;
                color: var(--qtai-ink-muted);
                line-height: 1.4;
                display: -webkit-box;
                -webkit-line-clamp: 2;
                -webkit-box-orient: vertical;
                overflow: hidden;
            }
            .qtai-search-modal mark { background: rgba(250, 204, 21, 0.45); color: inherit; border-radius: 3px; padding: 0 1px; }
            .qtai-chatbot-app.qtai-dark .qtai-search-modal mark { background: rgba(250, 204, 21, 0.30); }
            .qtai-chatbot-history-item,
            .qtai-chatbot-app button.qtai-chatbot-history-item {
                border: 1px solid transparent !important;
                background: transparent !important;
                border-radius: 8px !important;
                margin: 0 !important;
                text-align: left !important;
                cursor: pointer;
                font-family: inherit;
                position: relative;
                transition: border-color 0.15s, background 0.15s, box-shadow 0.15s;
                width: 100%;
                box-shadow: none !important;
                display: flex !important;
                flex-direction: row !important;
                align-items: center !important;
                justify-content: flex-start !important;
                height: auto !important;
                min-height: 0 !important;
                padding: 15px 38px 15px 12px !important;
                line-height: 1.35 !important;
                text-transform: none !important;
                letter-spacing: normal !important;
                overflow: visible !important;
                box-sizing: border-box !important;
                white-space: normal !important;
            }
            .qtai-chatbot-history-item:hover,
            .qtai-chatbot-app button.qtai-chatbot-history-item:hover {
                background: rgba(127, 127, 127, 0.10) !important;
                border-color: transparent !important;
                box-shadow: none !important;
            }
            .qtai-chatbot-history-item.active,
            .qtai-chatbot-app button.qtai-chatbot-history-item.active {
                background: var(--qtai-tea-bg) !important;
                border-color: transparent !important;
                box-shadow: none !important;
            }
            .qtai-chatbot-history-item.active .qtai-chatbot-history-item-title {
                color: var(--qtai-tea);
            }
            .qtai-chatbot-history-item-title {
                display: block;
                flex: 1 1 auto;
                min-width: 0;
                font-size: 14px !important;
                font-weight: 400 !important;
                color: var(--qtai-ink);
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
                line-height: 1.35 !important;
                text-transform: none !important;
                letter-spacing: normal !important;
            }
            .qtai-chatbot-history-item-meta {
                display: block;
                flex: 1 1 auto;
                min-width: 0;
                margin-top: 0;
                font-size: 11px !important;
                font-weight: 500 !important;
                color: var(--qtai-ink-muted);
                line-height: 1.35 !important;
                text-transform: none !important;
                letter-spacing: normal !important;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
            }
            .qtai-chatbot-history-item-foot {
                display: flex;
                align-items: center;
                justify-content: space-between;
                gap: 6px;
                width: 100%;
                margin-top: 4px;
            }
            .qtai-chatbot-history-item-actions {
                display: inline-flex;
                align-items: center;
                gap: 2px;
                flex: 0 0 auto;
            }
            .qtai-chatbot-history-item-menu-btn,
            .qtai-chatbot-app button.qtai-chatbot-history-item-menu-btn {
                position: absolute;
                top: 50%;
                right: 7px;
                transform: translateY(-50%);
                width: 28px;
                height: 28px;
                min-height: 0 !important;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                border: none !important;
                background: transparent !important;
                color: var(--qtai-ink-muted);
                border-radius: 7px !important;
                cursor: pointer;
                font-size: 18px;
                line-height: 1;
                padding: 0 !important;
                opacity: 0;
                box-shadow: none !important;
                transition: opacity 0.15s, background 0.15s, color 0.15s;
            }
            .qtai-chatbot-history-item:hover .qtai-chatbot-history-item-menu-btn,
            .qtai-chatbot-history-item.active .qtai-chatbot-history-item-menu-btn,
            .qtai-chatbot-history-item-menu-btn:focus { opacity: 1; }
            .qtai-chatbot-history-item-menu-btn:hover {
                background: rgba(120, 130, 145, 0.16) !important;
                color: var(--qtai-ink) !important;
            }
            .qtai-chatbot-histmenu {
                position: fixed;
                z-index: 99999;
                min-width: 184px;
                background: var(--qtai-white);
                border: 1px solid var(--qtai-border-light);
                border-radius: 12px;
                box-shadow: 0 12px 32px rgba(0,0,0,0.16);
                padding: 6px;
                display: flex;
                flex-direction: column;
                gap: 2px;
            }
            .qtai-chatbot-histmenu[hidden] { display: none; }
            .qtai-chatbot-histmenu-item,
            .qtai-chatbot-app button.qtai-chatbot-histmenu-item {
                display: flex;
                align-items: center;
                gap: 10px;
                width: 100%;
                text-align: left;
                padding: 8px 10px !important;
                min-height: 0 !important;
                border: none !important;
                background: transparent !important;
                color: var(--qtai-ink) !important;
                border-radius: 8px !important;
                cursor: pointer;
                font-size: 13px !important;
                font-weight: 500 !important;
                font-family: inherit;
                box-shadow: none !important;
            }
            .qtai-chatbot-histmenu-item:hover { background: var(--qtai-tea-bg) !important; }
            .qtai-chatbot-histmenu-item.is-danger,
            .qtai-chatbot-app button.qtai-chatbot-histmenu-item.is-danger { color: #dc2626 !important; }
            .qtai-chatbot-histmenu-item.is-danger:hover { background: rgba(220,38,38,0.10) !important; }
            .qtai-chatbot-histmenu-ic {
                font-size: 14px;
                width: 17px;
                text-align: center;
                flex: 0 0 auto;
            }
            .qtai-chatbot-history-item-delete,
            .qtai-chatbot-app button.qtai-chatbot-history-item-delete {
                position: static;
                transform: none;
                border: none !important;
                background: transparent !important;
                color: var(--qtai-ink-muted);
                width: 22px !important;
                height: 22px !important;
                min-height: 22px !important;
                border-radius: 6px !important;
                cursor: pointer;
                font-size: 14px !important;
                line-height: 1 !important;
                padding: 0 !important;
                opacity: 0;
                text-transform: none !important;
                transition: opacity 0.15s, background 0.15s, color 0.15s;
            }
            .qtai-chatbot-history-item:hover .qtai-chatbot-history-item-delete,
            .qtai-chatbot-history-item-delete:focus { opacity: 1; }
            .qtai-chatbot-history-item-delete:hover {
                background: #fee2e2;
                color: #b42318;
            }
            .qtai-chatbot-history-item-share,
            .qtai-chatbot-app button.qtai-chatbot-history-item-share {
                position: static;
                width: 22px;
                height: 22px;
                border: none;
                border-radius: 6px;
                background: transparent;
                color: var(--qtai-ink-muted);
                font-size: 12px;
                line-height: 1;
                cursor: pointer;
                opacity: 0;
                padding: 0;
                display: inline-flex;
                align-items: center;
                justify-content: center;
            }
            .qtai-chatbot-history-item:hover .qtai-chatbot-history-item-share,
            .qtai-chatbot-history-item-share:focus { opacity: 1; }
            .qtai-chatbot-history-item-share:hover {
                background: var(--qtai-accent-light);
                color: var(--qtai-accent-dark);
            }
            button.qtai-chatbot-share-session-btn {
                appearance: none;
                border: 1px solid var(--qtai-accent);
                background: var(--qtai-accent-light);
                color: var(--qtai-accent-dark);
                border-radius: 999px;
                padding: 6px 12px;
                font-size: 11px;
                font-weight: 700;
                cursor: pointer;
                font-family: inherit;
                display: inline-flex;
                align-items: center;
                gap: 6px;
                transition: border-color 0.15s, background 0.15s, color 0.15s, box-shadow 0.15s;
            }
            button.qtai-chatbot-share-session-btn:hover {
                border-color: var(--qtai-accent-dark);
                background: var(--qtai-accent-light);
                color: var(--qtai-accent-dark);
                filter: brightness(0.98);
            }
            .qtai-chatbot-share-modal {
                position: fixed;
                inset: 0;
                z-index: 2147483649;
                display: none;
                align-items: center;
                justify-content: center;
                padding: 20px;
                background: rgba(15, 23, 42, 0.45);
            }
            .qtai-chatbot-share-modal.active { display: flex; }
            .qtai-chatbot-share-modal-card {
                position: relative;
                width: min(520px, 100%);
                background: #fff;
                border-radius: 14px;
                border: 1px solid var(--qtai-border-light);
                box-shadow: 0 20px 50px rgba(15, 23, 42, 0.18);
                padding: 20px 22px;
            }
            .qtai-chatbot-share-modal-close {
                position: absolute;
                top: 12px;
                right: 12px;
                width: 32px;
                height: 32px;
                appearance: none;
                border: none;
                border-radius: 8px;
                background: transparent;
                color: var(--qtai-ink-muted);
                font-size: 24px;
                line-height: 1;
                cursor: pointer;
                font-family: inherit;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                transition: background 0.15s, color 0.15s;
            }
            .qtai-chatbot-share-modal-close:hover {
                background: var(--qtai-paper-deep);
                color: var(--qtai-ink);
            }
            .qtai-chatbot-share-modal-card h4 {
                margin: 0 0 8px;
                padding-right: 36px;
                font-size: 18px;
                color: var(--qtai-ink);
            }
            .qtai-chatbot-share-modal-card p {
                margin: 0 0 14px;
                font-size: 13px;
                line-height: 1.5;
                color: var(--qtai-ink-muted);
            }
            .qtai-chatbot-share-url-row {
                display: flex;
                gap: 8px;
                margin-bottom: 14px;
            }
            .qtai-chatbot-share-url-row input {
                flex: 1 1 auto;
                width: 100%;
                min-width: 0;
                border: 1px solid var(--qtai-border);
                border-radius: 8px;
                padding: 9px 10px;
                font-size: 13px;
                font-family: inherit;
                color: var(--qtai-ink);
                background: #fff;
            }
            .qtai-chatbot-share-actions button {
                appearance: none;
                border: 1px solid var(--qtai-border);
                border-radius: 8px;
                background: #fff;
                color: var(--qtai-ink);
                padding: 9px 12px;
                font-size: 12px;
                font-weight: 700;
                cursor: pointer;
                font-family: inherit;
            }
            .qtai-chatbot-share-actions button.primary {
                background: var(--qtai-tea);
                border-color: var(--qtai-tea);
                color: #fff;
                transition: background 0.15s, border-color 0.15s, color 0.15s, box-shadow 0.15s, transform 0.12s;
            }
            .qtai-chatbot-share-actions button.primary.is-copied {
                background: #059669;
                border-color: #059669;
                box-shadow: 0 0 0 3px rgba(5, 150, 105, 0.28);
            }
            .qtai-chatbot-share-actions button.primary.is-error-flash {
                background: #b91c1c;
                border-color: #b91c1c;
                box-shadow: 0 0 0 3px rgba(185, 28, 28, 0.22);
            }
            .qtai-chatbot-share-actions {
                display: flex;
                gap: 8px;
                justify-content: flex-end;
                flex-wrap: wrap;
            }
            .qtai-chatbot-share-actions button.danger {
                border-color: #fecaca;
                color: #b91c1c;
                background: #fff5f5;
            }
            .qtai-chatbot-history-empty {
                padding: 8px 8px 16px;
                font-size: 12px;
                color: var(--qtai-ink-muted);
                text-align: center;
                line-height: 1.5;
            }
            .qtai-chatbot-empty-login {
                display: inline-flex;
                align-items: center;
                margin-top: 10px;
                padding: 6px 14px;
                border-radius: 999px;
                background: var(--qtai-accent, #0d9488);
                color: #fff !important;
                font-weight: 600;
                font-size: 12px;
                text-decoration: none !important;
                transition: background 0.15s ease;
            }
            .qtai-chatbot-empty-login:hover {
                background: #0f766e;
                color: #fff !important;
            }
            .qtai-chatbot-samples {
                flex: 0 0 var(--qtai-sidebar-w);
                width: var(--qtai-sidebar-w);
                min-width: var(--qtai-sidebar-w);
                background: var(--qtai-paper-deep);
                border-left: 1px solid var(--qtai-border-light);
                display: flex;
                flex-direction: column;
                min-height: 0;
                overflow: hidden;
            }
            .qtai-chatbot-samples-head {
                padding: 14px;
                border-bottom: 1px solid var(--qtai-border-light);
                background: var(--qtai-paper);
                flex: 1 1 auto;
                overflow-y: auto;
            }
            /* Tiêu đề "CÔNG CỤ": in hoa, màu đen, canh trái, có gạch ngang phân cách với 4 nút ở trên */
            /* ===== Bảng điểm đã dùng (đáy thanh Công Cụ) ===== */
            /* ===== Nút vòng tròn hạn mức (kiểu Claude) đặt ở góc trên-phải ô nhập ===== */
            /* NẰM TRONG ô nhập, ngang hàng nút chọn model (góc trên-phải), KHÔNG tràn ra ngoài. */
            .qtai-chatbot-usage-fab-wrap {
                position: absolute;
                top: 0px;
                right: 25px;
                z-index: 9;
            }
            .qtai-chatbot-app button.qtai-chatbot-usage-fab {
                padding: 0;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;   /* KHÔNG nền */
    border: none;              /* KHÔNG viền */
    box-shadow: none;
    transition: transform .12s ease, stroke .2s ease;
            }
            .qtai-chatbot-usage-ring { display: block; width: 15px; height: 15px; }
            /* Track nửa trong suốt để hiện trên nền tint, fill accent đậm. */
            .qtai-chatbot-usage-ring-track { stroke: var(--qtai-accent); opacity: 0.22; stroke-width: 4.5; }
            .qtai-chatbot-usage-ring-fill {
                stroke: var(--qtai-accent);
                stroke-width: 4.5;
                transition: stroke-dasharray .35s ease, stroke .2s ease;
            }
            /* Chỉ ĐỔI MÀU VÒNG TRÒN theo trạng thái — không nền, không viền. */
            .qtai-chatbot-usage-fab-wrap.is-warn .qtai-chatbot-usage-ring-track { stroke: #e0a12e; }
            .qtai-chatbot-usage-fab-wrap.is-warn .qtai-chatbot-usage-ring-fill { stroke: #e0a12e; }
            .qtai-chatbot-usage-fab-wrap.is-over .qtai-chatbot-usage-ring-track { stroke: #e5484d; opacity: 0.28; }
            .qtai-chatbot-usage-fab-wrap.is-over .qtai-chatbot-usage-ring-fill { stroke: #e5484d; }

            /* ===== Popover hạn mức: ẩn sẵn, hiện khi rê chuột / bấm vòng tròn ===== */
            .qtai-chatbot-points {
                position: absolute;
                bottom: calc(100% + 10px);
                right: 0;
                width: 290px;
                max-width: calc(100vw - 32px);
                padding: 14px;
                border: 1px solid var(--qtai-border-light);
                border-radius: 14px;
                background: var(--qtai-paper);
                box-shadow: 0 12px 34px rgba(15, 23, 42, 0.22);
                display: flex;
                flex-direction: column;
                gap: 13px;
                opacity: 0;
                visibility: hidden;
                transform: translateY(6px);
                transition: opacity .16s ease, transform .16s ease, visibility .16s;
            }
            /* Cầu nối trong suốt lấp khoảng hở giữa nút và popover -> rê chuột không bị rớt. */
            .qtai-chatbot-points::after {
                content: '';
                position: absolute;
                left: 0;
                right: 0;
                bottom: -12px;
                height: 12px;
            }
            .qtai-chatbot-usage-fab-wrap:hover .qtai-chatbot-points,
            .qtai-chatbot-usage-fab-wrap.is-open .qtai-chatbot-points {
                opacity: 1;
                visibility: visible;
                transform: translateY(0);
            }
            .qtai-chatbot-points-head {
                display: flex;
                align-items: baseline;
                justify-content: space-between;
                gap: 8px;
            }
            .qtai-chatbot-points-title {
                font-size: 11px;
                font-weight: 700;
                letter-spacing: .04em;
                text-transform: uppercase;
                color: var(--qtai-ink-muted);
            }
            .qtai-chatbot-points-period { font-size: 11px; color: var(--qtai-ink-muted); }
            .qtai-chatbot-usage-row { display: flex; flex-direction: column; gap: 6px; }
            .qtai-chatbot-usage-row-head {
                display: flex;
                align-items: baseline;
                justify-content: space-between;
                gap: 8px;
            }
            .qtai-chatbot-usage-label {
                display: inline-flex;
                align-items: center;
                gap: 7px;
                font-size: 13px;
                color: var(--qtai-ink);
                min-width: 0;
                white-space: nowrap;
            }
            .qtai-chatbot-usage-label span { flex: none; }
            .qtai-chatbot-usage-label .qtai-usage-ico { width: 16px; height: 16px; flex: none; object-fit: contain; border-radius: 4px; }
            .qtai-chatbot-app .qtai-chatbot-usage-value {
                font-size: 12px;
                color: var(--qtai-ink-muted);
                white-space: nowrap;
                font-variant-numeric: tabular-nums;
                font-family: inherit;
            }
            .qtai-chatbot-app .qtai-chatbot-usage-value b {
                color: var(--qtai-ink);
                font-weight: 600;
                font-family: inherit;
            }
            /* Popup CHỌN SỐ GIÂY video (khi bật "Tạo video" trong chat). */
            .qtai-vsec-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.5); display: flex; align-items: center; justify-content: center; z-index: 100000; padding: 16px; }
            .qtai-vsec-box { background: var(--qtai-paper, #ffffff); color: var(--qtai-ink, #1f2937); border: 1px solid var(--qtai-border-light, #e5e7eb); border-radius: 16px; box-shadow: 0 20px 60px rgba(0,0,0,.45); padding: 20px; width: 100%; max-width: 360px; }
            .qtai-vsec-title { font-size: 16px; font-weight: 700; color: var(--qtai-ink, #1f2937); }
            .qtai-vsec-sub { font-size: 12px; color: var(--qtai-ink-muted, #6b7280); margin: 4px 0 14px; }
            .qtai-vsec-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; }
            .qtai-vsec-opt { padding: 12px 0; border: 1px solid var(--qtai-border-light, #e5e7eb); border-radius: 10px; background: var(--qtai-paper-deep, #f3f4f6); color: var(--qtai-ink, #1f2937); cursor: pointer; font-size: 15px; font-weight: 600; transition: border-color .15s, background .15s; }
            .qtai-vsec-opt.is-sel { border-color: var(--qtai-brand, #10b981); background: rgba(16,185,129,.14); color: var(--qtai-brand-text, #3FA97D); }
            .qtai-vsec-cost { text-align: center; margin: 14px 0 0; font-size: 13px; color: var(--qtai-ink, #1f2937); }
            .qtai-vsec-cost b { color: var(--qtai-brand-text, #3FA97D); }
            .qtai-vsec-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 16px; }
            .qtai-vsec-actions button { padding: 8px 16px; border-radius: 10px; font-weight: 600; cursor: pointer; border: 1px solid var(--qtai-border-light, #e5e7eb); font-size: 13px; }
            .qtai-vsec-cancel { background: transparent; color: var(--qtai-ink-muted, #6b7280); }
            .qtai-vsec-ok { background: var(--qtai-brand, #10b981); color: #fff; border-color: var(--qtai-brand, #10b981); }
            /* % ở cuối, đổi màu theo mức dùng — giống con số 62% / 91% của Claude. */
            .qtai-chatbot-usage-pct { color: var(--qtai-ink-muted); }
            .qtai-chatbot-usage-credit { color: var(--qtai-brand-text, #3FA97D); font-weight: 600; }
            .qtai-chatbot-usage-row.is-warn .qtai-chatbot-usage-pct { color: #c9871a; }
            .qtai-chatbot-usage-row.is-over .qtai-chatbot-usage-pct { color: #d64550; }
            .qtai-chatbot-usage-bar {
                height: 5px;
                border-radius: 999px;
                background: var(--qtai-paper-deep);
                overflow: hidden;
            }
            .qtai-chatbot-usage-bar[hidden] { display: none; }
            .qtai-chatbot-usage-bar > span {
                display: block;
                height: 100%;
                width: 0;
                border-radius: 999px;
                background: var(--qtai-accent);
                transition: width .35s ease, background .2s ease;
            }
            .qtai-chatbot-usage-row.is-warn .qtai-chatbot-usage-bar > span { background: #e0a12e; }
            .qtai-chatbot-usage-row.is-over .qtai-chatbot-usage-bar > span { background: #d64550; }
            .qtai-chatbot-samples-head h3 {
                margin: 0 0 10px;
                padding-top: 12px;
                border-top: 1px solid var(--qtai-border-light);
                font-size: 12px;
                font-weight: 700;
                letter-spacing: .04em;
                text-transform: uppercase;
                color: var(--qtai-ink);
                text-align: left;
            }
            .qtai-chatbot-fs-bar {
                margin-bottom: 12px;
            }
            .qtai-chatbot-samples-toolbar {
                display: flex;
                gap: 2px;
                margin-bottom: 12px;
                align-items: center;
                justify-content: space-between;
            }
            /* Nhóm trái (chia sẻ / xuất) và nhóm phải (phóng to / ẩn) */
            .qtai-chatbot-samples-toolbar .qtai-chatbot-toolbar-group {
                display: flex;
                align-items: center;
                gap: 2px;
            }
            /* Nút phẳng đơn giản dùng chung cho Chia sẻ / Xuất trên thanh công cụ */
            .qtai-chatbot-samples-toolbar .qtai-chatbot-export-wrap {
                width: auto;
            }
            .qtai-chatbot-samples-toolbar .qtai-chatbot-export-menu {
                right: 0;
                left: auto;
            }
            .qtai-chatbot-samples-toolbar .qtai-chatbot-tool-flat {
                appearance: none;
                border: none;
                background: transparent;
                color: var(--qtai-ink-muted);
                border-radius: 8px;
                padding: 6px;
                font-size: 12px;
                font-weight: 600;
                font-family: inherit;
                cursor: pointer;
                display: inline-flex;
                align-items: center;
                gap: 5px;
                box-shadow: none;
                transition: color 0.15s, background 0.15s;
            }
            .qtai-chatbot-samples-toolbar .qtai-chatbot-tool-flat:hover {
                background: var(--qtai-paper-deep);
                color: var(--qtai-ink);
            }
            .qtai-chatbot-samples-toolbar .qtai-chatbot-tool-flat svg { display: block; }
            .qtai-chatbot-samples-toolbar .qtai-chatbot-fs-btn,
            .qtai-chatbot-samples-toolbar .qtai-chatbot-samples-toggle-btn {
                flex: 0 0 auto;
                width: auto;
                min-width: 0;
                border: none;
                border-radius: 8px;
                background: transparent;
                color: var(--qtai-ink-muted);
                padding: 6px;
                box-shadow: none;
                letter-spacing: normal;
                transition: color 0.15s, background 0.15s;
            }
            .qtai-chatbot-samples-toolbar .qtai-chatbot-fs-btn:hover,
            .qtai-chatbot-samples-toolbar .qtai-chatbot-samples-toggle-btn:hover {
                transform: none;
                border: none;
                background: var(--qtai-paper-deep);
                color: var(--qtai-ink);
                box-shadow: none;
            }
            .qtai-chatbot-samples-toolbar .qtai-chatbot-fs-btn[aria-pressed="true"] {
                background: transparent;
                border: none;
                box-shadow: none;
                color: var(--qtai-tea);
            }
            .qtai-chatbot-samples-toolbar .qtai-chatbot-fs-btn[aria-pressed="true"]:hover {
                background: var(--qtai-paper-deep);
                border: none;
                box-shadow: none;
                color: var(--qtai-tea);
            }
            .qtai-chatbot-samples-toolbar .qtai-chatbot-fs-btn svg,
            .qtai-chatbot-samples-toolbar .qtai-chatbot-samples-toggle-btn svg {
                display: block;
            }
            button.qtai-chatbot-samples-toggle-btn {
                appearance: none;
                border: 1px solid var(--qtai-border);
                border-radius: 2px 12px 2px 12px;
                background: var(--qtai-white);
                color: var(--qtai-ink-muted);
                padding: 10px 8px;
                font-size: 11px;
                font-weight: 700;
                cursor: pointer;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                gap: 4px;
                font-family: inherit;
                transition: border-color 0.15s, background 0.15s, color 0.15s, box-shadow 0.15s;
            }
            button.qtai-chatbot-samples-toggle-btn:hover {
                border-color: var(--qtai-tea-border);
                background: var(--qtai-tea-bg);
                color: var(--qtai-tea);
            }
            button.qtai-chatbot-samples-show-btn {
                appearance: none;
                border: none;
                background: transparent;
                color: var(--qtai-ink-muted);
                padding: 4px;
                cursor: pointer;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                font-family: inherit;
                transition: color 0.15s;
            }
            button.qtai-chatbot-samples-show-btn svg { display: block; }
            button.qtai-chatbot-samples-show-btn:hover,
            button.qtai-chatbot-samples-show-btn:focus-visible {
                color: var(--qtai-ink);
            }
            button.qtai-chatbot-fs-btn {
                appearance: none;
                width: 100%;
                border: 1px solid var(--qtai-tea-border);
                border-left: 3px solid var(--qtai-tea);
                border-radius: 2px 12px 2px 12px;
                background: linear-gradient(145deg, var(--qtai-white) 0%, var(--qtai-paper-deep) 100%);
                color: var(--qtai-ink);
                padding: 10px 12px;
                font-size: 12px;
                font-weight: 700;
                letter-spacing: 0.02em;
                cursor: pointer;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                gap: 6px;
                font-family: inherit;
                box-shadow: 0 2px 8px rgba(44, 62, 53, 0.06);
                transition: transform 0.2s ease, border-color 0.15s, background 0.15s, box-shadow 0.2s ease, color 0.15s;
            }
            button.qtai-chatbot-fs-btn:hover {
                transform: translateY(-1px);
                border-color: var(--qtai-tea-light);
                background: linear-gradient(145deg, var(--qtai-tea-bg) 0%, var(--qtai-white) 100%);
                color: var(--qtai-tea);
                box-shadow: 0 6px 14px var(--qtai-shadow);
            }
            button.qtai-chatbot-fs-btn[aria-pressed="true"] {
                background: linear-gradient(135deg, var(--qtai-tea) 0%, var(--qtai-tea-light) 100%);
                border-color: var(--qtai-tea);
                color: #fff;
                box-shadow: 0 4px 14px rgba(26, 77, 143, 0.28);
            }
            button.qtai-chatbot-fs-btn[aria-pressed="true"]:hover {
                background: linear-gradient(135deg, var(--qtai-tea-light) 0%, var(--qtai-tea) 100%);
            }
            .qtai-chatbot-app.qtai-fs-active:not(:fullscreen):not(:-webkit-full-screen) {
                position: fixed !important;
                inset: 0;
                z-index: 2147483646;
                width: 100vw !important;
                height: 100vh !important;
                margin: 0 !important;
                border-radius: 0 !important;
                max-height: none !important;
                box-sizing: border-box;
                display: flex;
                flex-direction: column;
                padding: env(safe-area-inset-top, 0px) env(safe-area-inset-right, 0px) env(safe-area-inset-bottom, 0px) env(safe-area-inset-left, 0px);
            }
            html.qtai-chatbot-fs-fallback-fix { overflow: hidden; }
            .qtai-chatbot-app:fullscreen,
            .qtai-chatbot-app:-webkit-full-screen {
                display: flex;
                flex-direction: column;
                border-radius: 0;
                border: none;
                width: 100%;
                height: 100%;
                max-height: 100vh;
                overflow: hidden;
                padding: env(safe-area-inset-top, 0) env(safe-area-inset-right, 0) env(safe-area-inset-bottom, 0) env(safe-area-inset-left, 0);
            }
            .qtai-chatbot-app:fullscreen .qtai-chatbot-body,
            .qtai-chatbot-app:-webkit-full-screen .qtai-chatbot-body,
            .qtai-chatbot-app.qtai-fs-active .qtai-chatbot-body {
                flex: 1 1 auto;
                height: auto !important;
                max-height: none !important;
                min-height: 0 !important;
            }
            .qtai-chatbot-app:fullscreen .qtai-chatbot-history,
            .qtai-chatbot-app:-webkit-full-screen .qtai-chatbot-history,
            .qtai-chatbot-app:fullscreen .qtai-chatbot-samples,
            .qtai-chatbot-app:-webkit-full-screen .qtai-chatbot-samples,
            .qtai-chatbot-app.qtai-fs-active .qtai-chatbot-history,
            .qtai-chatbot-app.qtai-fs-active .qtai-chatbot-samples {
                max-height: none;
            }
            .qtai-chatbot-main {
                flex: 1 1 auto;
                min-width: 0;
                min-height: 0;
                display: flex;
                flex-direction: column;
                background: var(--qtai-paper);
                position: relative;
                overflow: hidden;
            }
            .qtai-chatbot-conversation {
                flex: 1 1 auto;
                min-height: 0;
                display: flex;
                flex-direction: column;
                opacity: 1;
                transition: opacity 0.45s ease 0.08s, flex 0.55s cubic-bezier(0.4, 0, 0.2, 1);
            }
            .qtai-chatbot-hero {
                display: none;
                flex-direction: column;
                align-items: center;
                justify-content: flex-end;
                text-align: center;
                padding: 0 28px 8px;
                pointer-events: none;
                user-select: none;
            }
            .qtai-chatbot-hero-logo {
                width: 64px;
                height: 64px;
                margin: 0 0 18px;
                padding: 0;
                border: none;
                background: transparent;
                border-radius: 50%;
                object-fit: contain;
                display: block;
                filter: drop-shadow(0 8px 20px rgba(26, 77, 143, 0.18));
            }
            .qtai-chatbot-hero-text {
                max-width: 520px;
                font-size: 15px;
                line-height: 1.6;
                color: var(--qtai-ink-muted);
                margin: 0;
            }
            /* Nút thao tác nhanh gói giáo viên (trên màn hình chào) */
            .qtai-teacher-actions {
                display: flex; flex-wrap: wrap; gap: 8px; justify-content: center;
                max-width: 620px; margin: 14px auto 0; pointer-events: auto;
            }
            .qtai-teacher-chip {
                display: inline-flex; align-items: center; gap: 7px; pointer-events: auto;
                border: 1px solid var(--qtai-border); background: var(--qtai-white);
                color: var(--qtai-ink); border-radius: 999px; padding: 8px 14px;
                font-size: 13.5px; cursor: pointer; transition: background .15s, border-color .15s;
            }
            .qtai-teacher-chip:hover { background: var(--qtai-paper-deep); border-color: var(--qtai-brand); }
            .qtai-teacher-chip-emoji { font-size: 15px; }
            .qtai-teacher-modal-back {
                position: fixed; inset: 0; background: rgba(0,0,0,.5); z-index: 100000;
                display: flex; align-items: center; justify-content: center; padding: 16px; pointer-events: auto;
            }
            /* Modal append vào <body> -> KHÔNG kế thừa var của .qtai-chatbot-app -> dùng MÀU CỨNG + biến thể .qtai-teacher-dark */
            .qtai-teacher-modal {
                background: #ffffff; color: #2C3E35; border: 1px solid #D9D2C5;
                border-radius: 14px; width: 100%; max-width: 480px; max-height: 92vh; overflow: auto;
                box-shadow: 0 12px 40px rgba(0,0,0,.25);
            }
            .qtai-teacher-modal-head {
                display: flex; align-items: center; justify-content: space-between; gap: 8px;
                padding: 14px 16px; border-bottom: 1px solid #E8E2D6; font-weight: 600; font-size: 15px;
            }
            .qtai-teacher-modal-x { border: none; background: transparent; font-size: 16px; cursor: pointer; color: #5A6B62; line-height: 1; padding: 4px; }
            .qtai-teacher-modal-body { padding: 13px 16px; display: grid; grid-template-columns: 1fr 1fr; gap: 9px 12px; }
            .qtai-teacher-field { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
            .qtai-teacher-field-full { grid-column: 1 / -1; }
            .qtai-teacher-field-label { font-size: 12px; color: #5A6B62; }
            .qtai-teacher-input {
                width: 100%; box-sizing: border-box; border: 1px solid #D9D2C5;
                border-radius: 9px; font-size: 13.5px; padding: 8px 10px; background: #FAF8F4;
                color: #2C3E35; font-family: inherit;
            }
            .qtai-teacher-input:focus { outline: none; border-color: #237D5A; }
            textarea.qtai-teacher-input { resize: vertical; min-height: 50px; }
            .qtai-teacher-modal-foot { padding: 10px 16px 14px; }
            @media (max-width: 430px) { .qtai-teacher-modal-body { grid-template-columns: 1fr; } }
            .qtai-teacher-go {
                width: 100%; border: none; background: #237D5A; color: #fff;
                border-radius: 10px; padding: 11px; font-size: 14.5px; font-weight: 600; cursor: pointer;
            }
            .qtai-teacher-go:hover { filter: brightness(1.08); }
            /* Dark variant */
            .qtai-teacher-dark .qtai-teacher-modal { background: #1b2638; color: #e6edf3; border-color: #2c3a4d; }
            .qtai-teacher-dark .qtai-teacher-modal-head { border-bottom-color: #26334a; }
            .qtai-teacher-dark .qtai-teacher-modal-x { color: #9fb0c0; }
            .qtai-teacher-dark .qtai-teacher-field-label { color: #9fb0c0; }
            .qtai-teacher-dark .qtai-teacher-input { background: #0f172a; border-color: #2c3a4d; color: #e6edf3; }
            .qtai-teacher-dark .qtai-teacher-input:focus { border-color: #3FA97D; }
            .qtai-chatbot-compose-slot {
                flex-shrink: 0;
                transition: flex 0.65s cubic-bezier(0.22, 1, 0.36, 1), padding 0.65s cubic-bezier(0.22, 1, 0.36, 1);
            }
            .qtai-chatbot-main.is-hero-compose {
                justify-content: center;
            }
            .qtai-chatbot-main.is-hero-compose::before {
                content: '';
                position: absolute;
                inset: 10% 12% 22%;
                background: radial-gradient(ellipse at 50% 42%, rgba(37, 99, 235, 0.07) 0%, rgba(13, 148, 136, 0.04) 38%, transparent 72%);
                pointer-events: none;
                z-index: 0;
                opacity: 0;
                animation: qtaiHeroGlowIn 1.1s ease 0.1s both;
            }
            .qtai-chatbot-main.is-hero-compose > *:not(.qtai-chatbot-main-toolbar):not(.qtai-chatbot-history-mobile-btn):not(.qtai-chatbot-history-backdrop) {
                position: relative;
                z-index: 1;
            }
            .qtai-chatbot-main.is-hero-compose .qtai-chatbot-conversation {
                flex: 0 0 0;
                min-height: 0;
                opacity: 0;
                overflow: hidden;
                pointer-events: none;
            }
            .qtai-chatbot-main.is-hero-compose .qtai-chatbot-hero {
                display: flex;
                flex: 0 0 auto;
                justify-content: center;
                align-items: center;
                min-height: 0;
                padding: 0 28px 40px;
            }
            .qtai-chatbot-main.is-hero-animate-in .qtai-chatbot-hero-logo {
                animation: qtaiHeroLogoIn 0.9s cubic-bezier(0.22, 1, 0.36, 1) both,
                           qtaiHeroLogoFloat 5s ease-in-out 0.95s infinite;
            }
            .qtai-chatbot-main.is-hero-animate-in .qtai-chatbot-hero-text {
                animation: qtaiHeroTextIn 0.85s cubic-bezier(0.22, 1, 0.36, 1) 0.14s both;
            }
            .qtai-chatbot-main.is-hero-compose .qtai-chatbot-compose-slot {
                flex: 0 0 auto;
                width: 100%;
                display: flex;
                flex-direction: column;
                align-items: center;
                margin-top: 0;
                padding: 0 20px clamp(16px, 3vh, 32px);
            }
            .qtai-chatbot-main.is-hero-animate-in .qtai-chatbot-compose-slot {
                animation: qtaiComposeSlotIn 0.95s cubic-bezier(0.22, 1, 0.36, 1) 0.24s both;
            }
            .qtai-chatbot-main.is-hero-compose .qtai-chatbot-compose {
                width: 100%;
                max-width: 720px;
                margin-top: 0;
                padding-bottom: 0;
            }
            .qtai-chatbot-main.is-hero-animate-in .qtai-chatbot-compose {
                animation: qtaiComposeHeroIn 0.95s cubic-bezier(0.34, 1.2, 0.64, 1) 0.28s both;
            }
            .qtai-chatbot-main.is-hero-compose .qtai-chatbot-input-shell {
                margin: 0;
                border-radius: 26px;
                padding: 12px 12px 12px;
                box-shadow: 0 10px 44px rgba(15, 23, 42, 0.1), 0 2px 10px rgba(15, 23, 42, 0.05);
                transition: box-shadow 0.35s ease, transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
            }
            /* Khi CÓ banner "hết điểm" (chỉ render khi $chat_exhausted) -> chừa thêm khoảng trên ô nhập. */
            .qtai-chatbot-main.is-hero-compose:has(.qtai-chatbot-exhausted-banner) .qtai-chatbot-input-shell {
                padding-top: 35px;
            }
            .qtai-chatbot-main.is-hero-compose .qtai-chatbot-input-shell:focus-within {
                transform: translateY(-2px);
                box-shadow: 0 16px 48px rgba(13, 148, 136, 0.16), 0 4px 14px rgba(15, 23, 42, 0.07);
            }
            .qtai-chatbot-main.is-hero-compose .qtai-chatbot-island-wrap {
                animation: qtaiIslandHeroPop 0.7s cubic-bezier(0.34, 1.25, 0.64, 1) 0.52s both;
            }
            .qtai-chatbot-main.is-hero-compose .qtai-chatbot-compose-meta {
                max-width: 720px;
                margin-left: auto;
                margin-right: auto;
                padding-left: 4px;
                padding-right: 4px;
                opacity: 0.85;
            }
            .qtai-chatbot-main.is-hero-compose .qtai-chatbot-compose-active-tools {
                margin-left: auto;
                margin-right: auto;
                max-width: 720px;
                padding-left: 20px;
                padding-right: 20px;
            }
            .qtai-chatbot-main.is-compose-docking::before {
                animation: qtaiHeroGlowOut 0.5s ease forwards;
            }
            .qtai-chatbot-main.is-compose-docking .qtai-chatbot-hero {
                animation: qtaiHeroFadeOut 0.55s cubic-bezier(0.4, 0, 0.2, 1) forwards;
            }
            .qtai-chatbot-main.is-compose-docking .qtai-chatbot-hero-logo {
                animation: qtaiHeroLogoOut 0.55s cubic-bezier(0.4, 0, 0.2, 1) forwards;
            }
            .qtai-chatbot-main.is-compose-docking .qtai-chatbot-compose-slot {
                animation: qtaiComposeDock 0.68s cubic-bezier(0.22, 1, 0.36, 1) forwards;
            }
            .qtai-chatbot-main.is-compose-docking .qtai-chatbot-conversation {
                animation: qtaiConversationReveal 0.62s cubic-bezier(0.22, 1, 0.36, 1) 0.18s both;
            }
            .qtai-chatbot-main.is-compose-docking .qtai-chatbot-input-shell {
                animation: qtaiInputShellDock 0.68s cubic-bezier(0.22, 1, 0.36, 1) forwards;
            }
            @keyframes qtaiHeroGlowIn {
                from { opacity: 0; transform: scale(0.92); }
                to { opacity: 1; transform: scale(1); }
            }
            @keyframes qtaiHeroGlowOut {
                from { opacity: 1; }
                to { opacity: 0; }
            }
            @keyframes qtaiHeroLogoIn {
                0% { opacity: 0; transform: scale(0.55) rotate(-8deg); filter: drop-shadow(0 0 0 transparent); }
                60% { opacity: 1; transform: scale(1.06) rotate(2deg); }
                100% { opacity: 1; transform: scale(1) rotate(0deg); filter: drop-shadow(0 8px 20px rgba(26, 77, 143, 0.18)); }
            }
            @keyframes qtaiHeroLogoFloat {
                0%, 100% { transform: translateY(0); }
                50% { transform: translateY(-5px); }
            }
            @keyframes qtaiHeroLogoOut {
                from { opacity: 1; transform: scale(1) translateY(0); }
                to { opacity: 0; transform: scale(0.88) translateY(-16px); }
            }
            @keyframes qtaiHeroTextIn {
                from { opacity: 0; transform: translateY(14px); filter: blur(4px); }
                to { opacity: 1; transform: translateY(0); filter: blur(0); }
            }
            @keyframes qtaiHeroFadeOut {
                from { opacity: 1; transform: translateY(0); }
                to { opacity: 0; transform: translateY(-20px); }
            }
            @keyframes qtaiComposeSlotIn {
                from { opacity: 0; transform: translateY(28px); }
                to { opacity: 1; transform: translateY(0); }
            }
            @keyframes qtaiComposeHeroIn {
                from { opacity: 0; transform: translateY(24px) scale(0.94); }
                to { opacity: 1; transform: translateY(0) scale(1); }
            }
            @keyframes qtaiComposeDock {
                from { opacity: 0.94; }
                to { opacity: 1; }
            }
            @keyframes qtaiInputShellDock {
                0% { border-radius: 26px; box-shadow: 0 10px 44px rgba(15, 23, 42, 0.1); }
                100% { border-radius: 24px; box-shadow: 0 2px 16px rgba(15, 23, 42, 0.06); }
            }
            @keyframes qtaiConversationReveal {
                from { opacity: 0; transform: translateY(10px); }
                to { opacity: 1; transform: translateY(0); }
            }
            @keyframes qtaiIslandHeroPop {
                from { opacity: 0; transform: translateY(8px) scale(0.88); }
                to { opacity: 1; transform: translateY(0) scale(1); }
            }
            @media (prefers-reduced-motion: reduce) {
                .qtai-chatbot-main.is-hero-compose::before,
                .qtai-chatbot-main.is-hero-animate-in .qtai-chatbot-hero-logo,
                .qtai-chatbot-main.is-hero-animate-in .qtai-chatbot-hero-text,
                .qtai-chatbot-main.is-hero-animate-in .qtai-chatbot-compose-slot,
                .qtai-chatbot-main.is-hero-animate-in .qtai-chatbot-compose,
                .qtai-chatbot-main.is-hero-compose .qtai-chatbot-island-wrap,
                .qtai-chatbot-main.is-compose-docking .qtai-chatbot-hero,
                .qtai-chatbot-main.is-compose-docking .qtai-chatbot-hero-logo,
                .qtai-chatbot-main.is-compose-docking .qtai-chatbot-compose-slot,
                .qtai-chatbot-main.is-compose-docking .qtai-chatbot-conversation,
                .qtai-chatbot-main.is-compose-docking .qtai-chatbot-input-shell,
                .qtai-chatbot-conversation {
                    animation: none !important;
                    transition: none !important;
                }
                .qtai-chatbot-main.is-hero-compose .qtai-chatbot-input-shell:focus-within {
                    transform: none;
                }
            }
            .qtai-chatbot-main-toolbar {
                position: absolute;
                top: 10px;
                right: 12px;
                z-index: 3;
                display: flex;
                align-items: center;
                gap: 4px;
                pointer-events: none;
            }
            .qtai-chatbot-main-toolbar > * {
                pointer-events: auto;
            }
            /* Nút "Công Cụ" chỉ hiện lại khi sidebar phải đang bị ẩn */
            .qtai-chatbot-main-toolbar .qtai-chatbot-samples-show-btn {
                display: none;
            }
            .qtai-chatbot-app.qtai-samples-hidden .qtai-chatbot-main-toolbar .qtai-chatbot-samples-show-btn {
                display: inline-flex;
            }
            /* ===== Nút hamburger + backdrop cho sidebar dạng drawer (chỉ màn hình nhỏ) ===== */
            .qtai-chatbot-history-mobile-btn {
                display: none; /* mặc định ẩn — chỉ hiện ở ≤600px */
                position: absolute;
                top: 10px;
                left: 10px;
                z-index: 6;
                width: 38px;
                height: 38px;
                align-items: center;
                justify-content: center;
                border: 1px solid var(--qtai-border-light);
                border-radius: 10px;
                background: var(--qtai-white);
                color: var(--qtai-ink);
                cursor: pointer;
                padding: 0;
                box-shadow: 0 2px 8px var(--qtai-shadow);
                transition: background .15s, border-color .15s, color .15s;
            }
            .qtai-chatbot-history-mobile-btn:hover {
                background: var(--qtai-paper-deep);
                border-color: var(--qtai-tea-border);
                color: var(--qtai-tea);
            }
            .qtai-chatbot-history-mobile-btn svg { display: block; }
            .qtai-chatbot-history-backdrop {
                display: none;
                position: fixed;
                inset: 0;
                z-index: 54;
                background: rgba(15, 23, 42, 0.44);
            }
            /* ===== Chat tạm thời (không lưu vào lịch sử) ===== */
            .qtai-chatbot-app button.qtai-chatbot-temp-btn {
                appearance: none;
                width: 34px;
                height: 34px;
                padding: 0;
                border: 1px solid transparent;
                border-radius: 50%;
                background: transparent;
                color: var(--qtai-ink-muted);
                cursor: pointer;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                font-family: inherit;
                line-height: 0;
                transition: color 0.15s, background 0.15s, border-color 0.15s;
            }
            .qtai-chatbot-app button.qtai-chatbot-temp-btn svg { display: block; }
            .qtai-chatbot-app button.qtai-chatbot-temp-btn:hover,
            .qtai-chatbot-app button.qtai-chatbot-temp-btn:focus-visible {
                color: var(--qtai-ink);
                background: var(--qtai-paper-deep);
            }
            .qtai-chatbot-app button.qtai-chatbot-temp-btn[aria-pressed="true"] {
                color: var(--qtai-white);
                background: var(--qtai-ink);
                border-color: var(--qtai-ink);
            }
            .qtai-chatbot-app.qtai-dark button.qtai-chatbot-temp-btn[aria-pressed="true"] {
                color: var(--qtai-paper);
                background: var(--qtai-ink);
                border-color: var(--qtai-ink);
            }
            .qtai-chatbot-temp-notice {
                flex: none;
                align-self: center;
                margin: 12px 16px 0;
                /* chừa chỗ cho cụm nút góc phải để không bị chồng lên nhau */
                max-width: min(560px, calc(100% - 110px));
                display: flex;
                align-items: center;
                gap: 8px;
                padding: 8px 14px;
                border-radius: 999px;
                border: 1px solid var(--qtai-border-light);
                background: var(--qtai-white);
                color: var(--qtai-ink-muted);
                font-size: 12.5px;
                line-height: 1.4;
                box-shadow: 0 4px 14px var(--qtai-shadow);
            }
            .qtai-chatbot-temp-notice[hidden] { display: none; }
            .qtai-chatbot-temp-notice strong { color: var(--qtai-ink); font-weight: 700; }
            .qtai-chatbot-temp-notice-ic {
                flex: none;
                display: inline-flex;
                color: var(--qtai-ink);
            }
            @media (max-width: 900px) {
                .qtai-chatbot-temp-notice {
                    font-size: 12px;
                    padding: 7px 12px;
                }
            }
            /* ===== Sidebar trái THU GỌN thành thanh icon hẹp (không ẩn hẳn) ===== */
            .qtai-chatbot-app.qtai-history-collapsed .qtai-chatbot-history {
                flex: 0 0 62px;
                width: 62px;
                min-width: 62px;
            }
            .qtai-chatbot-app.qtai-history-collapsed .qtai-chatbot-history-head {
                padding: 14px 8px 12px;
                align-items: center;
                gap: 8px;
            }
            .qtai-chatbot-app.qtai-history-collapsed .qtai-chatbot-history-brand-row {
                flex-direction: column;
                gap: 10px;
                width: 100%;
            }
            /* Thu gọn: giấu luôn cả cụm thương hiệu (logo + chữ "Trạm AI").
               Ẩn nguyên thẻ h3 chứ không chỉ ẩn logo bên trong — h3 rỗng vẫn là một flex item
               nên vẫn ăn gap 10px của brand-row, để lại một khoảng trống thừa ở đỉnh rail.
               Về trang chủ đã có icon ngôi nhà riêng ngay bên dưới. */
            .qtai-chatbot-app.qtai-history-collapsed .qtai-chatbot-history-brand {
                display: none !important;
            }
            /* Ẩn phần chữ / danh sách khi thu gọn — chỉ chừa icon. */
            .qtai-chatbot-app.qtai-history-collapsed .qtai-chatbot-history-brand span,
            .qtai-chatbot-app.qtai-history-collapsed .qtai-chatbot-btn-label,
            .qtai-chatbot-app.qtai-history-collapsed .qtai-chatbot-history-folders-wrap,
            .qtai-chatbot-app.qtai-history-collapsed .qtai-chatbot-history-list,
            .qtai-chatbot-app.qtai-history-collapsed .qtai-chatbot-account-info,
            .qtai-chatbot-app.qtai-history-collapsed .qtai-chatbot-account-caret {
                display: none !important;
            }
            .qtai-chatbot-app.qtai-history-collapsed .qtai-chatbot-history-actions {
                flex-direction: column;
                gap: 8px;
                width: 100%;
            }
            .qtai-chatbot-app.qtai-history-collapsed .qtai-chatbot-new-chat-btn,
            .qtai-chatbot-app.qtai-history-collapsed .qtai-chatbot-new-folder-btn,
            .qtai-chatbot-app.qtai-history-collapsed .qtai-chatbot-app button.qtai-chatbot-history-search-btn,
            .qtai-chatbot-app.qtai-history-collapsed .qtai-chatbot-history-search-btn {
                width: 40px !important;
                min-width: 40px;
                height: 40px;
                flex: none;
                padding: 0 !important;
                justify-content: center !important;
                gap: 0;
                margin: 0 auto;
            }
            .qtai-chatbot-app.qtai-history-collapsed .qtai-chatbot-account {
                padding: 8px 8px 10px;
                margin-top: auto; /* danh sách bị ẩn nên phải tự đẩy xuống đáy */
            }
            .qtai-chatbot-app.qtai-history-collapsed .qtai-chatbot-account-btn {
                width: 40px;
                padding: 0;
                height: 40px;
                justify-content: center;
                gap: 0;
                margin: 0 auto;
                border-radius: 999px;
            }
            /* Menu tài khoản: khi rail thu hẹp phải dùng position:fixed để thoát
               overflow:hidden của sidebar (nếu không sẽ bị cắt cụt). Toạ độ do JS đặt. */
            .qtai-chatbot-app.qtai-history-collapsed .qtai-chatbot-account-menu {
                position: fixed;
                left: auto;
                right: auto;
                top: auto;
                width: 250px;
                max-width: calc(100vw - 90px);
                z-index: 60;
            }
            /* ===== Nút "đoạn chat gần đây" — chỉ có ở thanh rail thu gọn ===== */
            .qtai-chatbot-rail-recent-btn { display: none; }
            .qtai-chatbot-app.qtai-history-collapsed .qtai-chatbot-new-folder-btn {
                display: none !important;
            }
            .qtai-chatbot-app.qtai-history-collapsed .qtai-chatbot-rail-recent-btn {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                width: 40px;
                height: 40px;
                flex: none;
                margin: 0 auto;
                padding: 0;
                border: 1px solid var(--qtai-border);
                border-radius: 10px;
                background: var(--qtai-white);
                color: #475569;
                cursor: pointer;
                font-family: inherit;
                transition: background 0.15s, border-color 0.15s, color 0.15s;
            }
            .qtai-chatbot-app.qtai-history-collapsed .qtai-chatbot-rail-recent-btn:hover,
            .qtai-chatbot-app.qtai-history-collapsed .qtai-chatbot-rail-recent-btn[aria-expanded="true"] {
                background: var(--qtai-paper-deep);
                border-color: var(--qtai-tea-border);
                color: var(--qtai-tea);
            }
            .qtai-chatbot-rail-recent-btn svg { display: block; }
            /* Bảng "Gần đây" bung ra cạnh thanh rail (vị trí do JS đặt) */
            .qtai-chatbot-app.qtai-history-collapsed.qtai-rail-recent-open .qtai-chatbot-history-list {
                display: block !important;
                position: fixed;
                width: 300px;
                max-width: calc(100vw - 90px);
                max-height: 60vh;
                overflow-y: auto;
                padding: 8px;
                background: var(--qtai-white);
                border: 1px solid var(--qtai-border-light);
                border-radius: 14px;
                box-shadow: 0 12px 40px rgba(15, 23, 42, 0.16);
                z-index: 60;
            }
            .qtai-chatbot-app.qtai-samples-hidden .qtai-chatbot-samples {
                display: none;
            }
            .qtai-chatbot-messages {
                flex: 1 1 auto;
                min-height: 0;
                overflow-y: auto;
                padding: 16px 20px 8px;
                display: flex;
                flex-direction: column;
                gap: 14px;
                scroll-behavior: smooth;
                background: var(--qtai-paper);
                align-items: center;
            }
            .qtai-chatbot-msg {
                display: flex;
                gap: 10px;
                width: 100%;
                max-width: 860px;
                animation: qtaiChatFadeIn 0.25s ease;
            }
            @keyframes qtaiChatFadeIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
            .qtai-chatbot-msg.user { justify-content: flex-end; }
            .qtai-chatbot-msg.assistant { justify-content: flex-start; }
            .qtai-chatbot-msg-avatar {
                flex: 0 0 32px;
                width: 32px;
                height: 32px;
                border-radius: 50%;
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 16px;
                background: var(--qtai-tea-bg);
            }
            .qtai-chatbot-msg-avatar.has-icon {
                background: transparent;
                padding: 0;
                overflow: hidden;
            }
            .qtai-chatbot-model-icon {
                width: 16px;
                height: 16px;
                border-radius: 50%;
                object-fit: cover;
                flex-shrink: 0;
                display: block;
            }
            .qtai-chatbot-msg-avatar .qtai-chatbot-model-icon {
                width: 100%;
                height: 100%;
            }
            .qtai-chatbot-msg-avatar .qtai-chatbot-welcome-icon {
                width: 100%;
                height: 100%;
                border-radius: 50%;
                object-fit: contain;
                background: var(--qtai-white);
                padding: 2px;
            }
            .qtai-chatbot-island-icon {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                flex-shrink: 0;
            }
            .qtai-chatbot-island-icon[hidden] {
                display: none !important;
            }
            .qtai-chatbot-island-icon .qtai-chatbot-model-icon {
                width: 14px;
                height: 14px;
            }
            .qtai-chatbot-msg-bubble {
                padding: 12px 14px;
                border-radius: 14px;
                font-size: 16px;
                line-height: 1.55;
                word-break: break-word;
                min-width: 0;
                max-width: 100%;
                box-shadow: none;
                position: relative;
            }
            .qtai-chatbot-msg-bubble:has(.qtai-chatbot-msg-actions) {
                padding-right: 70px;
            }
            /* Câu trả lời AI: đẩy nội dung xuống dưới hàng nút (đọc/tạo lại/sửa/sao chép) để không bị che dòng đầu */
            .qtai-chatbot-msg.assistant .qtai-chatbot-msg-bubble:has(.qtai-chatbot-msg-actions) {
                padding-top: 42px;
                padding-right: 14px;
            }

            .qtai-chatbot-msg-bubble:has(.qtai-chatbot-edit) {
                padding-right: 14px;
            }
            .qtai-chatbot-msg-actions {
                position: absolute;
                top: 8px;
                right: 8px;
                display: inline-flex;
                align-items: center;
                gap: 4px;
                opacity: 0;
                transition: opacity 0.15s ease;
                z-index: 2;
            }
            .qtai-chatbot-msg:hover .qtai-chatbot-msg-actions,
            .qtai-chatbot-msg-actions:focus-within,
            .qtai-chatbot-msg-actions:has(.is-copied) {
                opacity: 1;
            }
            .qtai-chatbot-msg-copy,
            .qtai-chatbot-msg-edit,
            .qtai-chatbot-msg-edit-user,
            .qtai-chatbot-msg-regen,
            .qtai-chatbot-msg-speak {
                position: static;
                width: 28px;
                height: 28px;
                min-height: 0;
                border: 1px solid var(--qtai-border-light);
                border-radius: 8px;
                background: rgba(255, 255, 255, 0.94);
                color: var(--qtai-ink-muted, #64748b);
                display: inline-flex;
                align-items: center;
                justify-content: center;
                padding: 0;
                margin: 0;
                cursor: pointer;
                opacity: 1;
                box-shadow: none;
                transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
            }
            .qtai-chatbot-msg-copy:hover,
            .qtai-chatbot-msg-edit:hover,
            .qtai-chatbot-msg-edit-user:hover,
            .qtai-chatbot-msg-regen:hover,
            .qtai-chatbot-msg-speak:hover {
                background: var(--qtai-white);
                color: var(--qtai-accent);
                border-color: rgba(13, 148, 136, 0.35);
            }
            .qtai-chatbot-msg-speak.is-speaking {
                background: var(--qtai-accent, #0d9488);
                border-color: var(--qtai-accent, #0d9488);
                color: #fff;
                animation: qtaiSpeakPulse 1.5s ease-in-out infinite;
            }
            .qtai-chatbot-msg-speak.is-speaking:hover {
                background: #0f766e;
                border-color: #0f766e;
                color: #fff;
            }
            .qtai-chatbot-msg-speak.is-loading {
                position: relative;
                color: transparent !important;
                cursor: progress;
            }
            .qtai-chatbot-msg-speak.is-loading::after {
                content: '';
                position: absolute;
                top: 50%;
                left: 50%;
                width: 13px;
                height: 13px;
                margin: -7px 0 0 -7px;
                border: 2px solid rgba(255, 255, 255, 0.45);
                border-top-color: #fff;
                border-radius: 50%;
                animation: qtaiSpin 0.7s linear infinite;
            }
            @keyframes qtaiSpin {
                to { transform: rotate(360deg); }
            }
            @keyframes qtaiSpeakPulse {
                0%   { box-shadow: 0 0 0 0 rgba(13, 148, 136, 0.45); }
                70%  { box-shadow: 0 0 0 7px rgba(13, 148, 136, 0); }
                100% { box-shadow: 0 0 0 0 rgba(13, 148, 136, 0); }
            }
            .qtai-chatbot-msg-copy.is-copied {
                color: #059669;
                border-color: rgba(5, 150, 105, 0.35);
            }
            @media (hover: none) {
                .qtai-chatbot-msg-actions {
                    opacity: 0.72;
                }
            }
            /* Sửa tin nhắn người dùng (inline) — phong cách tối giản */
            .qtai-chatbot-msg.user .qtai-chatbot-msg-bubble:has(.qtai-chatbot-edit) {
                background: #fff;
                border: 1px solid var(--qtai-border-light, #e2e8f0);
                box-shadow: 0 6px 24px rgba(15, 23, 42, 0.10);
                width: min(560px, 78vw);
                max-width: 100%;
            }
            /* Dark mode: thẻ form sửa dùng nền tối (mặc định #fff làm nút bị chìm) */
            .qtai-chatbot-app.qtai-dark .qtai-chatbot-msg.user .qtai-chatbot-msg-bubble:has(.qtai-chatbot-edit) {
                background: var(--qtai-white);
                border-color: var(--qtai-border-light);
                box-shadow: 0 6px 24px rgba(0, 0, 0, 0.45);
            }
            .qtai-chatbot-edit {
                display: flex;
                flex-direction: column;
                gap: 12px;
                width: 100%;
            }
            .qtai-chatbot-edit-input {
                width: 100%;
                box-sizing: border-box;
                min-height: 60px;
                max-height: 260px;
                resize: vertical;
                margin: 0;
                padding: 10px 12px;
                font: inherit;
                font-size: 14px;
                line-height: 1.6;
                color: var(--qtai-ink, #1e293b);
                background: #f8fafc;
                border: 1px solid var(--qtai-border-light, #e2e8f0);
                border-radius: 12px;
                box-shadow: none;
                transition: border-color 0.15s ease, background 0.15s ease;
            }
            .qtai-chatbot-edit-input:focus {
                outline: none;
                background: #fff;
                border-color: var(--qtai-accent, #0d9488);
                box-shadow: 0 0 0 3px rgba(13, 148, 136, 0.12);
            }
            .qtai-chatbot-edit-files {
                display: flex;
                flex-wrap: wrap;
                gap: 6px;
            }
            .qtai-chatbot-edit-files:empty {
                display: none;
            }
            .qtai-chatbot-edit-file-chip {
                display: inline-flex;
                align-items: center;
                gap: 6px;
                max-width: 220px;
                padding: 4px 8px 4px 5px;
                background: #f1f5f9;
                border: 1px solid var(--qtai-border-light, #e2e8f0);
                border-radius: 999px;
                font-size: 12px;
                color: var(--qtai-ink-muted, #64748b);
            }
            .qtai-chatbot-edit-file-chip img {
                width: 22px;
                height: 22px;
                border-radius: 6px;
                object-fit: cover;
                flex: none;
            }
            .qtai-chatbot-edit-file-chip-name {
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }
            .qtai-chatbot-edit-file-chip.is-unkeepable {
                opacity: 0.55;
            }
            .qtai-chatbot-edit-file-chip-note {
                font-size: 11px;
                font-style: italic;
                color: #b45309;
            }
            .qtai-chatbot-edit-file-remove {
                flex: none;
                width: 18px;
                height: 18px;
                min-height: 0;
                line-height: 1;
                text-align: center;
                border: none;
                border-radius: 50%;
                background: rgba(15, 23, 42, 0.08);
                color: inherit;
                cursor: pointer;
                font-size: 13px;
                padding: 0;
                box-shadow: none;
            }
            .qtai-chatbot-edit-file-remove:hover {
                background: rgba(239, 68, 68, 0.16);
                color: #dc2626;
            }
            .qtai-chatbot-edit-actions {
                display: flex;
                align-items: center;
                gap: 8px;
            }
            .qtai-chatbot-edit-actions .qtai-chatbot-edit-spacer {
                flex: 1;
            }
            .qtai-chatbot-edit-btn {
                margin: 0;
                padding: 7px 14px;
                border-radius: 999px;
                font-family: inherit;
                font-size: 13px;
                font-weight: 500;
                line-height: 1.2;
                letter-spacing: 0;
                text-transform: none;
                min-height: 0;
                height: auto;
                cursor: pointer;
                border: 1px solid transparent;
                background: transparent;
                color: var(--qtai-ink-muted, #64748b);
                box-shadow: none;
                transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
            }
            .qtai-chatbot-edit-add {
                margin-right: auto;
                padding-left: 10px;
                padding-right: 10px;
            }
            .qtai-chatbot-edit-add:hover,
            .qtai-chatbot-edit-cancel:hover {
                background: #f1f5f9;
                color: var(--qtai-ink, #1e293b);
            }
            .qtai-chatbot-edit-cancel {
                font-weight: 400;
            }
            .qtai-chatbot-edit-save {
                background: var(--qtai-ink, #1e293b);
                border-color: var(--qtai-ink, #1e293b);
                color: #fff;
                font-weight: 600;
            }
            .qtai-chatbot-edit-save:hover {
                background: #0f172a;
                border-color: #0f172a;
                color: #fff;
            }
            /* Dark mode: nút lệnh sửa tin nhắn không bị chìm */
            .qtai-chatbot-app.qtai-dark .qtai-chatbot-edit-btn {
                color: #cbd5e1;
            }
            .qtai-chatbot-app.qtai-dark .qtai-chatbot-edit-add:hover,
            .qtai-chatbot-app.qtai-dark .qtai-chatbot-edit-cancel:hover {
                background: rgba(255, 255, 255, 0.09);
                color: #fff;
            }
            .qtai-chatbot-app.qtai-dark .qtai-chatbot-edit-save {
                background: var(--qtai-accent);
                border-color: var(--qtai-accent);
                color: #06251f;
            }
            .qtai-chatbot-app.qtai-dark .qtai-chatbot-edit-save:hover {
                background: var(--qtai-accent-dark);
                border-color: var(--qtai-accent-dark);
                color: #06251f;
            }
            .qtai-chatbot-msg.user .qtai-chatbot-msg-bubble {
                background: var(--qtai-user-bg);
                border-bottom-right-radius: 4px;
            }
            .qtai-chatbot-user-text {
                white-space: pre-wrap;
                word-break: break-word;
                overflow-wrap: anywhere;
            }
            .qtai-chatbot-msg.assistant .qtai-chatbot-msg-bubble {
                background: transparent;
                border: none;
                box-shadow: none;
                padding-left: 2px;
                padding-right: 2px;
                border-radius: 8px;
            }
            .qtai-chatbot-msg-bubble.is-streaming {
                min-height: 24px;
            }
            .qtai-chatbot-msg-bubble.is-streaming.is-stream-waiting {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                min-width: 52px;
                min-height: 40px;
                padding: 10px 14px;
            }
            .qtai-chatbot-msg-bubble.is-streaming.is-stream-canvas .qtai-chatbot-stream-plain {
                color: var(--qtai-ink-muted);
                font-size: 14px;
                line-height: 1.55;
            }
            .qtai-chatbot-stream-plain:empty {
                display: none;
            }
            .qtai-chatbot-msg-bubble.is-stream-waiting .qtai-chatbot-stream-plain:empty {
                display: none;
            }
            .qtai-chatbot-stream-plain {
                white-space: pre-wrap;
                word-break: break-word;
            }
            .qtai-chatbot-stream-plain.is-stream-markdown {
                white-space: normal;
            }
            .qtai-chatbot-stream-indicator {
                display: inline-flex;
                align-items: center;
                vertical-align: middle;
                margin-left: 6px;
                gap: 4px;
                height: 1em;
            }
            .qtai-chatbot-msg-bubble.is-stream-waiting .qtai-chatbot-stream-indicator {
                margin-left: 0;
            }
            .qtai-chatbot-stream-dots {
                display: inline-flex;
                align-items: center;
                gap: 4px;
            }
            .qtai-chatbot-stream-dots span {
                display: block;
                width: 6px;
                height: 6px;
                border-radius: 50%;
                background: var(--qtai-accent, #1a4d8f);
                opacity: 0.35;
                animation: qtaiStreamDotPulse 1.4s infinite ease-in-out;
            }
            .qtai-chatbot-stream-dots span:nth-child(2) { animation-delay: 0.16s; }
            .qtai-chatbot-stream-dots span:nth-child(3) { animation-delay: 0.32s; }
            .qtai-chatbot-msg-bubble.is-stream-canvas .qtai-chatbot-stream-dots span {
                background: #2563eb;
            }
            @keyframes qtaiStreamDotPulse {
                0%, 80%, 100% {
                    opacity: 0.28;
                    transform: translateY(0) scale(0.82);
                }
                40% {
                    opacity: 1;
                    transform: translateY(-2px) scale(1);
                }
            }
            /* ==== Thẻ hiệu ứng ĐANG TẠO FILE (Word/Excel/PowerPoint/PDF) — mọi gói ==== */
            .qtai-chatbot-msg-bubble.is-streaming.is-stream-filecard {
                display: block;
                min-width: 0;
                padding: 0;
                background: transparent;
                box-shadow: none;
                border: none;
            }
            .qtai-chatbot-msg-bubble.is-stream-filecard .qtai-chatbot-stream-plain:empty { display: none; }
            .qtai-filecard {
                display: flex;
                align-items: center;
                gap: 12px;
                width: 100%;
                max-width: 340px;
                padding: 12px 14px;
                border-radius: 14px;
                background: var(--qtai-surface-2, #f2f6fc);
                border: 1px solid var(--qtai-border, rgba(26, 77, 143, 0.14));
                box-shadow: 0 3px 12px rgba(26, 77, 143, 0.09);
            }
            .qtai-filecard-icon {
                position: relative;
                flex-shrink: 0;
                width: 40px;
                height: 40px;
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 27px;
                line-height: 1;
                filter: drop-shadow(0 2px 5px rgba(26, 77, 143, 0.2));
                animation: qtaiFileFloat 2.4s ease-in-out infinite;
            }
            .qtai-filecard-pen {
                position: absolute;
                right: -5px;
                bottom: -4px;
                font-size: 16px;
                transform-origin: 70% 70%;
                animation: qtaiFilePen 1.05s ease-in-out infinite;
            }
            @keyframes qtaiFileFloat {
                0%, 100% { transform: translateY(0); }
                50% { transform: translateY(-3px); }
            }
            @keyframes qtaiFilePen {
                0%, 100% { transform: translate(0, 0) rotate(0deg); }
                50% { transform: translate(-2px, -2px) rotate(-14deg); }
            }
            .qtai-filecard-body { flex: 1 1 auto; min-width: 0; }
            .qtai-filecard-text {
                font-size: 13.5px;
                font-weight: 600;
                color: var(--qtai-ink, #17324f);
                margin-bottom: 8px;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
            }
            .qtai-filecard-text b { color: var(--qtai-accent, #1a4d8f); font-weight: 700; }
            .qtai-filecard-bar {
                display: block;
                height: 6px;
                border-radius: 999px;
                background: rgba(26, 77, 143, 0.12);
                overflow: hidden;
                position: relative;
            }
            .qtai-filecard-bar-fill {
                display: block;
                height: 100%;
                border-radius: 999px;
                background: linear-gradient(90deg, #1a4d8f, #3b82f6, #7cc0ff);
                background-size: 200% 100%;
                animation: qtaiFileShimmer 1.6s linear infinite;
                transition: width 0.4s ease;
            }
            .qtai-filecard-bar.indeterminate .qtai-filecard-bar-fill {
                width: 42%;
                animation: qtaiFileShimmer 1.6s linear infinite, qtaiFileSlide 1.4s ease-in-out infinite;
            }
            @keyframes qtaiFileShimmer {
                0% { background-position: 0% 0; }
                100% { background-position: 200% 0; }
            }
            @keyframes qtaiFileSlide {
                0% { transform: translateX(-120%); }
                100% { transform: translateX(320%); }
            }
            /* Theo THEME CỦA APP (.qtai-dark), KHÔNG theo prefers-color-scheme của HĐH —
               nếu không, máy để Dark nhưng app nền sáng sẽ cho chữ trắng trên nền kem => vô hình. */
            .qtai-chatbot-app.qtai-dark .qtai-filecard {
                background: rgba(255, 255, 255, 0.05);
                border-color: rgba(255, 255, 255, 0.1);
            }
            .qtai-chatbot-app.qtai-dark .qtai-filecard-text { color: #e6edf7; }
            .qtai-chatbot-app.qtai-dark .qtai-filecard-text b { color: #7cc0ff; }
            /* Nền sáng: ép màu rõ, không phụ thuộc biến có thể chưa định nghĩa (--qtai-surface-2). */
            .qtai-filecard { background: #eef4fc; border-color: #c7d9f0; }
            .qtai-filecard-text { color: #1e3a5f; }
            .qtai-filecard-text b { color: #1a4d8f; }
            .qtai-chatbot-msg-bubble p { margin: 0 0 8px; }
            .qtai-chatbot-msg-bubble p:last-child { margin-bottom: 0; }
            .qtai-chatbot-msg-bubble ul, .qtai-chatbot-msg-bubble ol { margin: 0 0 8px; padding-left: 20px; }
            .qtai-chatbot-msg-bubble ul { list-style: disc; }
            .qtai-chatbot-msg-bubble ul ul { list-style: circle; margin-top: 4px; }
            .qtai-chatbot-msg-bubble ol { list-style-type: decimal; }
            .qtai-chatbot-msg-bubble li { margin-bottom: 4px; line-height: 1.45; }
            .qtai-chatbot-msg-bubble li:last-child { margin-bottom: 0; }
            .col-inner ul li { margin-left: 0 !important; }
            /* Code — cách ly CSS theme Flatsome / WordPress */
            #qtai-chatbot-app .qtai-chatbot-msg-bubble pre {
                display: block;
                background: #1e293b !important;
                color: #e2e8f0 !important;
                padding: 12px 14px !important;
                border-radius: 8px;
                overflow-x: auto;
                overflow-y: hidden;
                max-width: 100%;
                margin: 10px 0 !important;
                border: 1px solid #334155 !important;
                box-shadow: none !important;
                font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !important;
                font-size: 13px !important;
                line-height: 1.55 !important;
                white-space: pre;
                word-break: normal;
                overflow-wrap: normal;
                tab-size: 4;
            }
            #qtai-chatbot-app .qtai-chatbot-msg-bubble pre code {
                display: block;
                background: transparent !important;
                color: inherit !important;
                padding: 0 !important;
                margin: 0 !important;
                border: none !important;
                border-radius: 0 !important;
                box-shadow: none !important;
                font-size: inherit !important;
                font-family: inherit !important;
                font-weight: 400 !important;
                line-height: inherit !important;
                white-space: inherit;
                word-break: inherit;
                overflow-wrap: inherit;
                opacity: 1 !important;
            }
            #qtai-chatbot-app .qtai-chatbot-msg-bubble :not(pre) > code {
                background: var(--qtai-paper-deep) !important;
                color: var(--qtai-ink) !important;
                padding: 2px 6px;
                border-radius: 4px;
                font-size: 13px;
                font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
            }
            #qtai-chatbot-app .qtai-chatbot-msg-bubble pre *,
            #qtai-chatbot-app .qtai-chatbot-msg-bubble pre code * {
                color: inherit !important;
                background: transparent !important;
                font-family: inherit !important;
                opacity: 1 !important;
            }
            .qtai-chatbot-msg-bubble h1,
            .qtai-chatbot-msg-bubble h2,
            .qtai-chatbot-msg-bubble h3,
            .qtai-chatbot-msg-bubble h4 {
                margin: 14px 0 8px;
                font-weight: 700;
                color: var(--qtai-ink);
                line-height: 1.35;
            }
            .qtai-chatbot-msg-bubble h1 { font-size: 18px; margin-top: 4px; }
            .qtai-chatbot-msg-bubble h2 { font-size: 16px; }
            .qtai-chatbot-msg-bubble h3 { font-size: 15px; }
            .qtai-chatbot-msg-bubble h4 { font-size: 14px; }
            .qtai-chatbot-table-wrap {
                overflow-x: auto;
                margin: 10px 0;
                border: 1px solid var(--qtai-border-light);
                border-radius: 10px;
                background: var(--qtai-white);
            }
            .qtai-chatbot-table {
                width: 100%;
                border-collapse: collapse;
                font-size: 13px;
                line-height: 1.45;
            }
            .qtai-chatbot-table th,
            .qtai-chatbot-table td {
                padding: 8px 10px;
                border-bottom: 1px solid var(--qtai-border-light);
                text-align: left;
                vertical-align: top;
            }
            .qtai-chatbot-table th {
                background: var(--qtai-paper-deep);
                font-weight: 700;
                white-space: nowrap;
            }
            .qtai-chatbot-table tr:last-child td {
                border-bottom: none;
            }
            .qtai-chatbot-table tbody tr:nth-child(even) td {
                background: rgba(250, 248, 244, 0.65);
            }
            .qtai-chatbot-app.qtai-dark .qtai-chatbot-table th {
                background: #0f1a28;
                color: var(--qtai-ink);
            }
            .qtai-chatbot-app.qtai-dark .qtai-chatbot-table td {
                color: var(--qtai-ink);
            }
            .qtai-chatbot-app.qtai-dark .qtai-chatbot-table tbody tr:nth-child(even) td {
                background: rgba(255, 255, 255, 0.05);
            }
            .qtai-chatbot-grounding {
                margin-top: 12px;
                padding-top: 10px;
                border-top: 1px solid rgba(15, 23, 42, 0.08);
            }
            .qtai-chatbot-grounding-label {
                font-size: 11px;
                font-weight: 700;
                letter-spacing: 0.04em;
                text-transform: uppercase;
                color: var(--qtai-ink-muted);
                margin-bottom: 8px;
            }
            .qtai-chatbot-grounding-queries {
                display: flex;
                flex-wrap: wrap;
                gap: 6px;
                margin-bottom: 8px;
            }
            .qtai-chatbot-grounding-query {
                display: inline-flex;
                align-items: center;
                gap: 4px;
                padding: 4px 10px;
                border-radius: 999px;
                background: rgba(22, 163, 74, 0.1);
                color: #166534;
                font-size: 12px;
            }
            .qtai-chatbot-grounding-sources {
                display: flex;
                flex-wrap: wrap;
                gap: 6px;
                align-items: center;
            }
            .qtai-chatbot-grounding-source {
                display: inline-flex;
                align-items: center;
                max-width: 160px;
                padding: 4px 10px;
                border-radius: 999px;
                background: rgba(29, 78, 216, 0.08);
                border: 1px solid rgba(29, 78, 216, 0.14);
                font-size: 11px;
                line-height: 1.3;
                color: #1d4ed8;
                text-decoration: none;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
            }
            .qtai-chatbot-grounding-source:hover {
                text-decoration: none;
                background: rgba(29, 78, 216, 0.14);
            }
            .qtai-chatbot-grounding-source-more {
                display: inline-flex;
                align-items: center;
                padding: 4px 10px;
                border-radius: 999px;
                background: rgba(15, 23, 42, 0.06);
                border: 1px dashed rgba(15, 23, 42, 0.14);
                font-size: 11px;
                line-height: 1.3;
                color: var(--qtai-ink-muted);
                white-space: nowrap;
            }
            .qtai-sources-panel-backdrop {
                position: fixed;
                inset: 0;
                background: rgba(0,0,0,0.3);
                z-index: 100000;
                opacity: 0;
                visibility: hidden;
                transition: opacity 0.2s ease;
            }
            .qtai-sources-panel-backdrop.active { opacity: 1; visibility: visible; }
            .qtai-sources-panel {
                position: fixed;
                top: 0;
                right: 0;
                width: 400px;
                max-width: 90vw;
                height: 100vh;
                background: #fff;
                box-shadow: -4px 0 24px rgba(0,0,0,0.15);
                z-index: 100001;
                transform: translateX(100%);
                transition: transform 0.25s ease;
                display: flex;
                flex-direction: column;
            }
            .qtai-sources-panel.active { transform: translateX(0); }
            .qtai-sources-panel-head {
                display: flex;
                align-items: center;
                justify-content: space-between;
                padding: 16px 20px;
                border-bottom: 1px solid rgba(0,0,0,0.08);
                flex-shrink: 0;
            }
            .qtai-sources-panel-title { font-size: 18px; font-weight: 700; color: #111827; }
            .qtai-sources-panel-close {
                background: none;
                border: none;
                font-size: 26px;
                line-height: 1;
                color: #6b7280;
                cursor: pointer;
                padding: 0 4px;
            }
            .qtai-sources-panel-close:hover { color: #111827; }
            .qtai-sources-panel-body { overflow-y: auto; padding: 8px 0; flex: 1; }
            .qtai-source-item {
                display: block;
                padding: 14px 20px;
                text-decoration: none;
                border-bottom: 1px solid rgba(0,0,0,0.05);
                transition: background 0.12s ease;
            }
            .qtai-source-item:hover { background: #f9fafb; text-decoration: none; }
            .qtai-source-item-head {
                display: flex;
                align-items: center;
                gap: 7px;
                margin-bottom: 6px;
            }
            .qtai-source-item-favicon { width: 16px; height: 16px; border-radius: 3px; flex-shrink: 0; }
            .qtai-source-item-site { font-size: 12px; color: #6b7280; }
            .qtai-source-item-title {
                font-size: 14px;
                font-weight: 600;
                color: #111827;
                line-height: 1.4;
                margin-bottom: 5px;
            }
            .qtai-source-item-snippet {
                font-size: 13px;
                color: #6b7280;
                line-height: 1.45;
                display: -webkit-box;
                -webkit-line-clamp: 2;
                -webkit-box-orient: vertical;
                overflow: hidden;
            }
            .qtai-chatbot-sources-btn {
                display: inline-flex;
                align-items: center;
                gap: 5px;
                background: none;
                border: none;
                cursor: pointer;
                color: var(--qtai-ink-muted);
                padding: 4px 8px;
                border-radius: 6px;
                font-size: 12px;
            }
            .qtai-chatbot-sources-btn:hover { background: rgba(0,0,0,0.05); color: #111827; }
            .qtai-sources-btn-stack {
                display: inline-flex;
                align-items: center;
            }
            .qtai-sources-btn-stack img {
                width: 16px;
                height: 16px;
                border-radius: 50%;
                border: 1.5px solid #fff;
                background: #fff;
                margin-left: -5px;
                object-fit: cover;
            }
            .qtai-sources-btn-stack img:first-child { margin-left: 0; }
            .qtai-source-cards {
                display: flex;
                gap: 10px;
                overflow-x: auto;
                padding: 4px 2px 12px;
                margin-bottom: 8px;
                scrollbar-width: thin;
                -webkit-overflow-scrolling: touch;
            }
            .qtai-source-cards::-webkit-scrollbar { height: 6px; }
            .qtai-source-cards::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.15); border-radius: 3px; }
            .qtai-source-card {
                flex: 0 0 200px;
                width: 200px;
                border: 1px solid rgba(0,0,0,0.1);
                border-radius: 12px;
                overflow: hidden;
                text-decoration: none;
                background: #fff;
                transition: box-shadow 0.15s ease, transform 0.15s ease;
                display: flex;
                flex-direction: column;
            }
            .qtai-source-card:hover {
                box-shadow: 0 4px 16px rgba(0,0,0,0.12);
                transform: translateY(-2px);
                text-decoration: none;
            }
            .qtai-source-card-img {
                width: 100%;
                height: 110px;
                object-fit: cover;
                background: #f3f4f6;
                display: block;
            }
            .qtai-source-card-body { padding: 10px 12px; }
            .qtai-source-card-source {
                display: flex;
                align-items: center;
                gap: 6px;
                font-size: 11px;
                color: #6b7280;
                margin-bottom: 5px;
            }
            .qtai-source-card-favicon { width: 14px; height: 14px; border-radius: 3px; flex-shrink: 0; }
            .qtai-source-card-title {
                font-size: 13px;
                font-weight: 600;
                color: #111827;
                line-height: 1.35;
                display: -webkit-box;
                -webkit-line-clamp: 3;
                -webkit-box-orient: vertical;
                overflow: hidden;
            }
            .qtai-source-card-time {
                font-size: 11px;
                color: #9ca3af;
                margin-top: 6px;
            }
            .qtai-source-card-time:empty { display: none; }
            .qtai-reasoning-block {
                margin: 0 0 10px;
                border: 1px solid rgba(124, 58, 237, 0.18);
                border-radius: 10px;
                background: rgba(124, 58, 237, 0.04);
                overflow: hidden;
            }
            .qtai-reasoning-summary {
                display: flex;
                align-items: center;
                gap: 7px;
                padding: 8px 12px;
                cursor: pointer;
                font-size: 13px;
                color: #6d28d9;
                font-weight: 500;
                list-style: none;
                user-select: none;
            }
            .qtai-reasoning-summary::-webkit-details-marker { display: none; }
            .qtai-reasoning-summary::after {
                content: '▸';
                margin-left: auto;
                font-size: 11px;
                transition: transform 0.2s ease;
            }
            .qtai-reasoning-block[open] .qtai-reasoning-summary::after { transform: rotate(90deg); }
            .qtai-reasoning-icon { font-size: 15px; }
            .qtai-reasoning-content {
                padding: 4px 14px 12px 14px;
                font-size: 13px;
                line-height: 1.6;
                color: #57534e;
                white-space: pre-wrap;
                word-break: break-word;
                border-top: 1px solid rgba(124, 58, 237, 0.1);
                margin-top: 2px;
                padding-top: 10px;
            }
            a.qtai-inline-cite {
                display: inline-flex;
                align-items: center;
                background: rgba(29, 78, 216, 0.07);
                border: 1px solid rgba(29, 78, 216, 0.18);
                border-radius: 5px;
                padding: 1px 7px;
                font-size: 0.72em;
                font-style: normal;
                color: #1d4ed8;
                text-decoration: none;
                margin: 0 2px;
                vertical-align: middle;
                line-height: 1.7;
                white-space: nowrap;
                max-width: 160px;
                overflow: hidden;
                text-overflow: ellipsis;
                cursor: pointer;
                position: relative;
            }
            a.qtai-inline-cite:hover {
                background: rgba(29, 78, 216, 0.14);
                text-decoration: none;
            }
            .qtai-cite-tooltip {
                position: fixed;
                z-index: 99999;
                background: #fff;
                border: 1px solid rgba(0,0,0,0.13);
                border-radius: 12px;
                box-shadow: 0 8px 32px rgba(0,0,0,0.18);
                max-width: 320px;
                min-width: 240px;
                pointer-events: none;
                opacity: 0;
                transition: opacity 0.15s ease;
                font-size: 13px;
                line-height: 1.45;
                overflow: hidden;
            }
            .qtai-cite-tooltip.visible { opacity: 1; pointer-events: auto; }
            a.qtai-cite-tooltip-body { display: block; text-decoration: none; }
            a.qtai-cite-tooltip-body:hover { text-decoration: none; background: #f9fafb; }
            .qtai-cite-nav {
                display: inline-flex;
                align-items: center;
                gap: 4px;
                margin-left: auto;
                flex-shrink: 0;
            }
            .qtai-cite-nav-btn {
                background: none;
                border: 1px solid rgba(0,0,0,0.12);
                border-radius: 5px;
                width: 22px;
                height: 20px;
                font-size: 12px;
                line-height: 1;
                color: #374151;
                cursor: pointer;
                padding: 0;
            }
            .qtai-cite-nav-btn:disabled { opacity: 0.35; cursor: default; }
            .qtai-cite-nav-btn:not(:disabled):hover { background: rgba(0,0,0,0.06); }
            .qtai-cite-nav-count { font-size: 11px; color: #9ca3af; margin-left: 2px; }
            .qtai-cite-more {
                display: inline-block;
                margin-left: 4px;
                font-size: 0.92em;
                font-weight: 600;
                color: #6b7280;
            }
            .qtai-cite-tooltip-urlbar {
                display: flex;
                align-items: center;
                gap: 6px;
                padding: 8px 12px;
                background: #f9fafb;
                border-bottom: 1px solid rgba(0,0,0,0.07);
            }
            .qtai-cite-tooltip-url {
                flex: 1;
                font-size: 11px;
                color: #6b7280;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
            }
            .qtai-cite-tooltip-body {
                padding: 10px 12px 12px;
            }
            .qtai-cite-tooltip-source-row {
                display: flex;
                align-items: center;
                gap: 6px;
                margin-bottom: 6px;
            }
            .qtai-cite-tooltip-favicon {
                width: 16px;
                height: 16px;
                border-radius: 3px;
                flex-shrink: 0;
            }
            .qtai-cite-tooltip-source {
                font-size: 12px;
                color: #374151;
                font-weight: 500;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
            }
            .qtai-cite-tooltip-title {
                font-weight: 600;
                color: #111827;
                margin-bottom: 6px;
                font-size: 13px;
                display: -webkit-box;
                -webkit-line-clamp: 2;
                -webkit-box-orient: vertical;
                overflow: hidden;
            }
            .qtai-cite-tooltip-snippet {
                color: #6b7280;
                font-size: 12px;
                display: -webkit-box;
                -webkit-line-clamp: 3;
                -webkit-box-orient: vertical;
                overflow: hidden;
            }
            .qtai-chatbot-google-search-entry {
                margin-top: 8px;
                display: flex;
                flex-wrap: wrap;
                gap: 6px;
                align-items: center;
            }
            .qtai-chatbot-google-search-entry a {
                display: inline-flex !important;
                align-items: center;
                padding: 4px 10px !important;
                border-radius: 999px !important;
                font-size: 11px !important;
                line-height: 1.3 !important;
                white-space: nowrap;
                max-width: 100%;
            }
            .qtai-chatbot-typing {
                display: none;
                align-items: center;
                gap: 8px;
                /* Căn KHỚP với ô nhập: cùng max-width, cùng lề trái (30px của input-shell + 10px
                   padding + ~14px cho thẳng chữ). Nằm trong compose-slot, ngay trên ô nhập. */
                width: 100%;
                max-width: 860px;
                margin: 0 auto;
                padding: 2px 44px 8px;
                font-size: 13px;
                color: var(--qtai-ink-muted);
                background: transparent;
                flex-shrink: 0;
            }
            .qtai-chatbot-typing.active { display: flex; }
            .qtai-chatbot-typing.research {
                color: #1d4ed8;
            }
            .qtai-chatbot-typing.research .qtai-chatbot-typing-dots span {
                background: #2563eb;
            }
            .qtai-chatbot-typing-icon {
                font-size: 14px;
                line-height: 1;
            }
            .qtai-chatbot-research-badge {
                display: inline-flex;
                align-items: center;
                gap: 6px;
                margin-bottom: 10px;
                padding: 4px 10px;
                border-radius: 999px;
                background: rgba(37, 99, 235, 0.1);
                color: #1d4ed8;
                font-size: 12px;
                font-weight: 600;
            }
            .qtai-chatbot-island.research-active {
                box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.25);
            }
            .qtai-chatbot-typing-dots span {
                display: inline-block;
                width: 6px;
                height: 6px;
                border-radius: 50%;
                background: var(--qtai-accent);
                margin-right: 3px;
                animation: qtaiChatDot 1.2s infinite ease-in-out;
            }
            .qtai-chatbot-typing-dots span:nth-child(2) { animation-delay: 0.15s; }
            .qtai-chatbot-typing-dots span:nth-child(3) { animation-delay: 0.3s; }
            @keyframes qtaiChatDot { 0%, 80%, 100% { opacity: 0.3; transform: scale(0.8); } 40% { opacity: 1; transform: scale(1); } }
            .qtai-chatbot-compose {
                flex-shrink: 0;
                margin-top: auto;
                margin-left: auto;
                margin-right: auto;
                width: 100%;
                max-width: 860px;
                padding: 0 0 14px;
                border-top: none;
                background: var(--qtai-paper);
            }
            .qtai-chatbot-input-shell {
                position: relative;
                margin: 0 30px;
                padding: 10px 10px 10px;
                border: 1px solid var(--qtai-border);
                border-radius: 24px;
                background: var(--qtai-white);
                box-shadow: 0 2px 16px rgba(15, 23, 42, 0.06);
                transition: border-color 0.2s, box-shadow 0.2s;
            }
            .qtai-chatbot-input-shell:focus-within {
                border-color: var(--qtai-accent);
                box-shadow: 0 4px 22px rgba(13, 148, 136, 0.12);
            }
            .qtai-chatbot-island-wrap {
                position: relative;
                margin: 0 0 8px 6px;
                z-index: 6;
            }
            .qtai-chatbot-island {
                position: relative;
                display: inline-flex;
                align-items: center;
                gap: 7px;
                min-height: 28px;
                background: var(--qtai-paper);
                color: var(--qtai-ink);
                border-radius: 10px;
                font-size: 11.5px;
                font-weight: 600;
                letter-spacing: 0.01em;
                white-space: nowrap;
                max-width: min(300px, 82vw);
                cursor: pointer;
                user-select: none;
                box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
                font-family: inherit;
                transition: background 0.18s ease, border-color 0.18s ease;
            }
            .qtai-chatbot-island:hover,
            .qtai-chatbot-island.is-open {
                background: var(--qtai-white);
                border-color: var(--qtai-accent);
            }
            .qtai-chatbot-island-prefix {
                flex-shrink: 0;
                color: var(--qtai-ink-muted);
                font-weight: 500;
            }
            .qtai-chatbot-island > * {
                pointer-events: none;
            }
            .qtai-chatbot-island-pulse {
                flex-shrink: 0;
                width: 6px;
                height: 6px;
                border-radius: 50%;
                background: #34d399;
            }
            .qtai-chatbot-island-label {
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
                max-width: 160px;
            }
            .qtai-chatbot-island-chevron {
                flex-shrink: 0;
                font-size: 10px;
                opacity: 0.72;
                margin-left: -2px;
                transition: transform 0.2s ease;
            }
            .qtai-chatbot-island.is-open .qtai-chatbot-island-chevron {
                transform: rotate(180deg);
            }
            .qtai-chatbot-island-menu {
                position: absolute;
                bottom: calc(100% + 10px);
                left: 0;
                transform: none;
                min-width: 240px;
                max-width: min(300px, 86vw);
                overflow: visible;
                background: var(--qtai-white);
                border: 1px solid var(--qtai-border);
                border-radius: 16px;
                padding: 0;
                box-shadow: 0 16px 48px rgba(15, 23, 42, 0.18);
            }
            .qtai-chatbot-island-menu-body {
                max-height: 240px;
                overflow-x: hidden;
                overflow-y: auto;
                padding: 6px;
                scrollbar-width: thin;
                scrollbar-color: var(--qtai-border) transparent;
            }
            .qtai-chatbot-island-menu-footer {
                padding: 0 6px 6px;
            }
            .qtai-chatbot-island-menu[hidden] {
                display: none;
            }
            .qtai-chatbot-island-option {
                display: flex;
                align-items: center;
                gap: 8px;
                width: 100%;
                text-align: left;
                border: none;
                background: transparent;
                color: var(--qtai-ink);
                padding: 9px 12px;
                border-radius: 10px;
                font-size: 12px;
                font-weight: 500;
                line-height: 1.35;
                cursor: pointer;
                font-family: inherit;
            }
            .qtai-chatbot-island-option:hover {
                background: rgba(13, 148, 136, 0.10);
            }
            /* Model có mô tả -> hiển thị 2 dòng: tên + mô tả nhỏ. Icon canh theo đầu dòng. */
            .qtai-chatbot-island-option:has(.qtai-chatbot-island-option-text) {
                align-items: flex-start;
            }
            .qtai-chatbot-island-option-text {
                display: flex;
                flex-direction: column;
                gap: 2px;
                min-width: 0;
                flex: 1;
            }
            .qtai-chatbot-island-option-name {
                font-weight: 600;
            }
            .qtai-chatbot-island-option-desc {
                font-size: 11px;
                font-weight: 400;
                line-height: 1.3;
                color: var(--qtai-ink-muted, #5A6B62);
                white-space: normal;
            }
            .qtai-chatbot-island-option.active {
                background: rgba(13, 148, 136, 0.14);
                color: var(--qtai-accent);
                font-weight: 600;
            }
            .qtai-chatbot-island-option.is-locked {
                opacity: 0.78;
            }
            .qtai-chatbot-island-option.is-locked .qtai-chatbot-model-lock {
                margin-left: auto;
                font-size: 10px;
                font-weight: 700;
                letter-spacing: 0.04em;
                color: #b45309;
                background: #fef3c7;
                border: 1px solid #fcd34d;
                border-radius: 999px;
                padding: 2px 8px;
                flex-shrink: 0;
            }
            .qtai-chatbot-island-divider {
                height: 1px;
                margin: 4px 8px;
                background: var(--qtai-border);
            }
            .qtai-chatbot-island-more-wrap {
                position: relative;
            }
            .qtai-chatbot-island-more-trigger {
                justify-content: space-between;
            }
            .qtai-chatbot-island-more-trigger.is-active,
            .qtai-chatbot-island-menu.is-submenu-open .qtai-chatbot-island-more-trigger {
                background: rgba(13, 148, 136, 0.10);
            }
            .qtai-chatbot-island-more-trigger .qtai-chatbot-island-more-meta {
                margin-left: auto;
                display: inline-flex;
                align-items: center;
                gap: 6px;
                flex-shrink: 0;
                color: var(--qtai-ink-muted);
                font-size: 11px;
                font-weight: 600;
            }
            .qtai-chatbot-island-more-trigger .qtai-chatbot-island-more-chevron {
                font-size: 14px;
                line-height: 1;
                opacity: 0.85;
            }
            .qtai-chatbot-island-submenu {
                position: absolute;
                left: calc(100% + 10px);
                right: auto;
                bottom: 8px;
                top: auto;
                min-width: 240px;
                max-width: min(300px, 86vw);
                max-height: min(320px, 52vh);
                overflow-x: hidden;
                overflow-y: auto;
                background: var(--qtai-white);
                border: 1px solid var(--qtai-border);
                border-radius: 16px;
                padding: 6px;
                box-shadow: 0 16px 48px rgba(15, 23, 42, 0.18);
                opacity: 0;
                visibility: hidden;
                pointer-events: none;
                transition: opacity 0.15s ease, visibility 0.15s ease;
                z-index: 4;
                scrollbar-width: thin;
                scrollbar-color: var(--qtai-border) transparent;
            }
            .qtai-chatbot-island-submenu::before {
                content: '';
                position: absolute;
                top: 0;
                right: 100%;
                width: 12px;
                height: 100%;
            }
            .qtai-chatbot-island-menu.is-submenu-flip-left .qtai-chatbot-island-submenu {
                left: auto;
                right: calc(100% + 10px);
            }
            .qtai-chatbot-island-menu.is-submenu-flip-left .qtai-chatbot-island-submenu::before {
                right: auto;
                left: 100%;
            }
            .qtai-chatbot-island-menu.is-submenu-open .qtai-chatbot-island-submenu {
                opacity: 1;
                visibility: visible;
                pointer-events: auto;
            }
            .qtai-chatbot-island-submenu-title {
                padding: 6px 12px 4px;
                font-size: 10px;
                font-weight: 700;
                letter-spacing: 0.06em;
                text-transform: uppercase;
                color: var(--qtai-ink-muted);
            }
            .qtai-chatbot-island-select-native {
                position: absolute !important;
                width: 1px !important;
                height: 1px !important;
                opacity: 0 !important;
                pointer-events: none !important;
                clip: rect(0, 0, 0, 0) !important;
                overflow: hidden !important;
                border: 0 !important;
                padding: 0 !important;
                margin: -1px !important;
            }
            .qtai-chatbot-compose-inner {
                display: flex;
                gap: 8px;
                align-items: center;
                padding: 0;
                border: none !important;
                outline: none !important;
                box-shadow: none !important;
                border-radius: 0;
                background: transparent;
            }
            .qtai-chatbot-compose-active-tools {
                display: flex;
                flex-wrap: wrap;
                justify-content: center;
                align-items: center;
                gap: 8px;
                width: 100%;
                margin: 10px 30px 0;
                padding: 0;
            }
            .qtai-chatbot-compose-active-tools.is-empty {
                display: none;
            }
            .qtai-chatbot-compose-tool-chip {
                display: inline-flex;
                align-items: center;
                gap: 8px;
                padding: 0px 10px 0px 14px;
                border-radius: 999px;
                /* Dùng biến (sáng #ffffff / tối #1b2638) — hard-code #ffffff sẽ thành
                   nền trắng + chữ sáng = vô hình ở giao diện tối. */
                background: var(--qtai-white);
                border: 1px solid rgba(15, 23, 42, 0.08);
                color: var(--qtai-ink);
                font-size: 13px;
                font-weight: 600;
                line-height: 1;
                white-space: nowrap;
                box-shadow: 0 2px 10px rgba(15, 23, 42, 0.08), 0 1px 3px rgba(15, 23, 42, 0.04);
                animation: qtaiComposeChipIn 0.22s cubic-bezier(0.22, 1, 0.36, 1) both;
            }
            .qtai-chatbot-compose-tool-chip-icon {
                font-size: 14px;
                line-height: 1;
                flex-shrink: 0;
            }
            .qtai-chatbot-compose-tool-chip-label {
                line-height: 1.2;
            }
            .qtai-chatbot-compose-tool-chip-remove {
                appearance: none;
                border: none;
                background: transparent;
                color: var(--qtai-ink-muted);
                width: 18px;
                height: 18px;
                border-radius: 50%;
                cursor: pointer;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                font-size: 15px;
                line-height: 1;
                padding: 0;
                margin: 0 0 0 1px;
                transition: background 0.15s, color 0.15s;
            }
            .qtai-chatbot-compose-tool-chip-remove:hover {
                background: rgba(15, 23, 42, 0.08);
                color: var(--qtai-ink);
            }
            /* Giao diện tối: viền xanh-đen 8% và bóng đen nhạt đều tan biến trên nền tối. */
            .qtai-chatbot-app.qtai-dark .qtai-chatbot-compose-tool-chip {
                border-color: var(--qtai-border);
                box-shadow: 0 2px 10px rgba(0, 0, 0, 0.4), 0 1px 3px rgba(0, 0, 0, 0.25);
            }
            .qtai-chatbot-app.qtai-dark .qtai-chatbot-compose-tool-chip-remove:hover {
                background: rgba(255, 255, 255, 0.14);
                color: var(--qtai-ink);
            }
            @keyframes qtaiComposeChipIn {
                from { opacity: 0; transform: scale(0.9); }
                to { opacity: 1; transform: scale(1); }
            }
            .qtai-chatbot-compose-tools {
                position: relative;
                flex-shrink: 0;
                margin-bottom: 2px;
            }
            .qtai-chatbot-compose-tools-btn {
                border: 1px solid var(--qtai-border);
                border-radius: 50%;
                width: 40px;
                height: 40px;
                cursor: pointer;
                background: var(--qtai-white);
                color: var(--qtai-ink);
                display: flex;
                align-items: center;
                justify-content: center;
                box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
                transition: background 0.15s, color 0.15s, border-color 0.15s, transform 0.28s cubic-bezier(0.22, 1, 0.36, 1);
                flex-shrink: 0;
                padding: 0;
                line-height: 1;
            }
            .qtai-chatbot-compose-tools-btn:hover:not(:disabled) {
                background: var(--qtai-accent-light);
                border-color: var(--qtai-accent);
                color: var(--qtai-accent-dark);
            }
            .qtai-chatbot-compose-tools-btn.is-open {
                background: var(--qtai-paper-deep);
                border-color: var(--qtai-border);
                color: var(--qtai-ink);
            }
            .qtai-chatbot-compose-tools-btn:disabled {
                opacity: 0.45;
                cursor: not-allowed;
            }
            .qtai-chatbot-compose-tools-btn svg {
                width: 20px !important;
                height: 20px !important;
                min-width: 20px;
                min-height: 20px;
                display: block;
                flex-shrink: 0;
                transition: transform 0.28s cubic-bezier(0.22, 1, 0.36, 1);
            }
            .qtai-chatbot-compose-tools-btn svg path {
                stroke: currentColor;
                fill: none;
            }
            .qtai-chatbot-compose-tools-btn.is-open svg {
                transform: rotate(45deg);
            }
            .qtai-chatbot-compose-tools-menu {
                position: absolute;
                left: 0;
                bottom: calc(100% + 10px);
                min-width: 248px;
                padding: 8px;
                border-radius: 16px;
                background: var(--qtai-white);
                border: 1px solid var(--qtai-border-light);
                box-shadow: 0 12px 40px rgba(15, 23, 42, 0.14), 0 2px 8px rgba(15, 23, 42, 0.06);
                z-index: 30;
                opacity: 0;
                visibility: hidden;
                transform: translateY(8px) scale(0.96);
                transform-origin: left bottom;
                transition: opacity 0.22s ease, transform 0.22s cubic-bezier(0.22, 1, 0.36, 1), visibility 0.22s;
                pointer-events: none;
            }
            .qtai-chatbot-compose-tools-menu.is-open {
                opacity: 1;
                visibility: visible;
                transform: translateY(0) scale(1);
                pointer-events: auto;
            }
            .qtai-chatbot-compose-tools-divider {
                height: 1px;
                margin: 6px 4px;
                background: var(--qtai-border-light);
            }
            .qtai-chatbot-compose-tools-item {
                appearance: none;
                width: 100%;
                border: none;
                background: transparent;
                color: var(--qtai-ink);
                border-radius: 12px;
                padding: 10px 12px;
                font-size: 14px;
                font-family: inherit;
                display: flex;
                align-items: center;
                gap: 12px;
                cursor: pointer;
                text-align: left;
                transition: background 0.15s ease;
            }
            .qtai-chatbot-compose-tools-item:hover:not(:disabled) {
                background: var(--qtai-paper-deep);
            }
            .qtai-chatbot-compose-tools-item:disabled {
                opacity: 0.45;
                cursor: not-allowed;
            }
            .qtai-chatbot-compose-tools-item.is-active {
                background: var(--qtai-tea-bg);
                color: var(--qtai-tea);
            }
            .qtai-chatbot-compose-tools-item.is-active:hover:not(:disabled) {
                background: #e3ecfa;
            }
            .qtai-chatbot-compose-tools-icon {
                width: 22px;
                height: 22px;
                flex-shrink: 0;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                font-size: 16px;
                line-height: 1;
            }
            .qtai-chatbot-compose-tools-icon svg {
                width: 18px;
                height: 18px;
                display: block;
            }
            .qtai-chatbot-compose-tools-label {
                flex: 1 1 auto;
                min-width: 0;
                line-height: 1.35;
            }
            .qtai-chatbot-compose-tools-check {
                flex-shrink: 0;
                width: 18px;
                height: 18px;
                border-radius: 50%;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                font-size: 11px;
                font-weight: 700;
                color: var(--qtai-tea);
                opacity: 0;
                transform: scale(0.6);
                transition: opacity 0.15s ease, transform 0.15s ease;
            }
            .qtai-chatbot-compose-tools-item.is-active .qtai-chatbot-compose-tools-check {
                opacity: 1;
                transform: scale(1);
            }
            .qtai-chatbot-attach-btn {
                flex-shrink: 0;
                border: 1px solid var(--qtai-border);
                border-radius: 50%;
                width: 40px;
                height: 40px;
                cursor: pointer;
                background: var(--qtai-white);
                color: var(--qtai-tea);
                font-size: 18px;
                display: flex;
                align-items: center;
                justify-content: center;
                margin-bottom: 2px;
                box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
                transition: background 0.15s, color 0.15s, border-color 0.15s;
            }
            .qtai-chatbot-attach-btn:hover:not(:disabled) {
                background: var(--qtai-accent-light);
                border-color: var(--qtai-accent);
                color: var(--qtai-accent-dark);
            }
            .qtai-chatbot-attach-btn:disabled {
                opacity: 0.45;
                cursor: not-allowed;
            }
            .qtai-chatbot-attach-btn svg,
            .qtai-chatbot-send-btn svg {
                width: 20px;
                height: 20px;
                flex-shrink: 0;
                display: block;
            }
            .qtai-chatbot-mic-btn {
                flex-shrink: 0;
                border: 1px solid var(--qtai-border);
                border-radius: 50%;
                width: 40px;
                height: 40px;
                cursor: pointer;
                background: var(--qtai-white);
                color: var(--qtai-tea);
                display: flex;
                align-items: center;
                justify-content: center;
                margin-bottom: 2px;
                box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
                transition: background 0.15s, color 0.15s, border-color 0.15s;
            }
            .qtai-chatbot-mic-btn[hidden] { display: none !important; }
            .qtai-chatbot-mic-btn svg {
                width: 20px !important;
                height: 20px !important;
                min-width: 20px;
                min-height: 20px;
                display: block;
                flex-shrink: 0;
            }
            .qtai-chatbot-mic-btn svg path {
                stroke: currentColor;
                fill: none;
            }
            .qtai-chatbot-mic-btn:hover:not(:disabled) {
                background: var(--qtai-accent-light);
                border-color: var(--qtai-accent);
                color: var(--qtai-accent-dark);
            }
            .qtai-chatbot-mic-btn:disabled { opacity: 0.45; cursor: not-allowed; }
            .qtai-chatbot-mic-btn.is-recording {
                background: #ef4444;
                border-color: #ef4444;
                color: #fff;
                animation: qtaiMicPulse 1.4s ease-in-out infinite;
            }
            .qtai-chatbot-mic-btn.is-recording:hover {
                background: #dc2626;
                border-color: #dc2626;
                color: #fff;
            }
            @keyframes qtaiMicPulse {
                0%   { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.45); }
                70%  { box-shadow: 0 0 0 8px rgba(239, 68, 68, 0); }
                100% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0); }
            }
            .qtai-chatbot-file-input {
                position: absolute !important;
                width: 1px !important;
                height: 1px !important;
                opacity: 0 !important;
                pointer-events: none !important;
                clip: rect(0, 0, 0, 0) !important;
            }
            .qtai-chatbot-file-queue {
                display: none;
                flex-wrap: wrap;
                gap: 6px;
                margin-bottom: 8px;
            }
            .qtai-chatbot-file-queue.has-files {
                display: flex;
            }
            .qtai-chatbot-file-chip {
                display: inline-flex;
                align-items: center;
                gap: 6px;
                max-width: 100%;
                padding: 4px 8px 4px 4px;
                border-radius: 999px;
                background: var(--qtai-paper-deep);
                border: 1px solid var(--qtai-border);
                font-size: 11px;
                color: var(--qtai-ink);
            }
            .qtai-chatbot-file-chip-thumb {
                width: 24px;
                height: 24px;
                border-radius: 6px;
                object-fit: cover;
                flex-shrink: 0;
                background: var(--qtai-white);
            }
            .qtai-chatbot-file-chip-icon {
                width: 24px;
                height: 24px;
                border-radius: 6px;
                display: flex;
                align-items: center;
                justify-content: center;
                background: var(--qtai-white);
                flex-shrink: 0;
                font-size: 13px;
            }
            .qtai-chatbot-file-chip-name {
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
                max-width: 140px;
            }
            .qtai-chatbot-file-chip-remove {
                border: none;
                background: transparent;
                color: var(--qtai-ink-muted);
                cursor: pointer;
                font-size: 14px;
                line-height: 1;
                padding: 0 2px;
            }
            .qtai-chatbot-file-chip-remove:hover {
                color: #b42318;
            }
            .qtai-chatbot-msg-files {
                display: flex;
                flex-wrap: wrap;
                gap: 6px;
                margin-bottom: 8px;
            }
            .qtai-chatbot-msg-file {
                display: inline-flex;
                align-items: center;
                gap: 6px;
                padding: 4px 8px 4px 4px;
                border-radius: 8px;
                background: rgba(255,255,255,0.72);
                border: 1px solid var(--qtai-border-light);
                font-size: 11px;
            }
            .qtai-chatbot-msg-file img {
                width: 36px;
                height: 36px;
                border-radius: 6px;
                object-fit: cover;
                cursor: zoom-in;
            }
            .qtai-chatbot-expandable-img {
                cursor: zoom-in;
            }
            .qtai-chatbot-msg-bubble .qtai-chatbot-expandable-img {
                max-width: min(100%, 512px);
                max-height: 512px;
                width: auto;
                height: auto;
                border-radius: 8px;
                display: block;
                margin: 6px 0;
            }
            .qtai-chatbot-generated-image {
                margin-top: 12px;
                display: flex;
                flex-direction: column;
                gap: 10px;
            }
            .qtai-chatbot-generated-image-frame {

            }
            .qtai-chatbot-generated-image-frame img {
                display: block;
                width: 100%;
                height: auto;
                cursor: zoom-in;
            }
            .qtai-chatbot-generated-image-frame.is-loading {
                min-height: 220px;
                display: flex;
                align-items: center;
                justify-content: center;
                color: var(--qtai-ink-muted);
                font-size: 13px;
            }
            /* Ảnh 404 (file đã bị xoá/hết hạn lưu trữ) -> khung gọn thay cho ô trống. */
            .qtai-chatbot-generated-image-expired {
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                gap: 10px;
                text-align: center;
                padding: 26px 18px;
                border: 1px dashed var(--qtai-border);
                border-radius: 12px;
                background: var(--qtai-tea-bg);
            }
            .qtai-chatbot-generated-image-expired-icon {
                font-size: 26px;
                opacity: .8;
            }
            .qtai-chatbot-generated-image-expired-text {
                font-size: 13px;
                color: var(--qtai-ink-muted);
                max-width: 320px;
                line-height: 1.5;
            }
            .qtai-chatbot-generated-image-expired-hint {
                font-size: 12px;
                color: var(--qtai-ink-muted);
                opacity: .85;
            }
            .qtai-chatbot-generated-image-expired-btn {
                display: inline-flex;
                align-items: center;
                gap: 6px;
                padding: 8px 16px;
                border: 1px solid var(--qtai-tea);
                border-radius: 999px;
                background: var(--qtai-tea);
                color: #fff;
                font-size: 13px;
                font-weight: 600;
                cursor: pointer;
                transition: opacity .15s ease;
            }
            .qtai-chatbot-generated-image-expired-btn:hover { opacity: .88; }
            .qtai-chatbot-generated-image-expired-btn:disabled { opacity: .55; cursor: default; }
            .qtai-chatbot-app.qtai-dark .qtai-chatbot-generated-image-expired {
                background: rgba(255,255,255,.05);
                border-color: var(--qtai-border);
            }
            /* Dải thông số THẬT của tấm ảnh: model nào chạy, tỷ lệ, sửa hay tạo mới */
            .qtai-chatbot-generated-image-meta {
                display: flex;
                flex-wrap: wrap;
                gap: 6px;
                align-items: center;
            }
            .qtai-chatbot-generated-image-meta .qtai-img-chip {
                display: inline-flex;
                align-items: center;
                gap: 4px;
                padding: 2px 8px;
                border: 1px solid var(--qtai-border);
                border-radius: 999px;
                background: var(--qtai-tea-bg);
                color: var(--qtai-ink-muted);
                font-size: 11px;
                line-height: 1.7;
                white-space: nowrap;
            }
            .qtai-chatbot-generated-image-meta .qtai-img-chip b {
                color: var(--qtai-ink);
                font-weight: 600;
            }
            .qtai-chatbot-app.qtai-dark .qtai-chatbot-generated-image-meta .qtai-img-chip {
                background: rgba(255,255,255,.06);
                border-color: var(--qtai-border);
                color: #9fb3c8;
            }
            .qtai-chatbot-app.qtai-dark .qtai-chatbot-generated-image-meta .qtai-img-chip b {
                color: #e6edf6;
            }
            .qtai-chatbot-generated-image-prompt {
                font-size: 12px;
                color: var(--qtai-ink-muted);
            }
            .qtai-chatbot-generated-image-prompt summary {
                cursor: pointer;
                user-select: none;
            }
            .qtai-chatbot-generated-image-prompt p {
                margin: 8px 0 0;
                white-space: pre-wrap;
                line-height: 1.45;
            }
            .qtai-chatbot-generated-image-actions {
                display: flex;
                align-items: center;
                gap: 10px;
                flex-wrap: wrap;
            }
            .qtai-chatbot-generated-image-regen {
                border: 1px solid var(--qtai-border);
                background: var(--qtai-white);
                color: var(--qtai-ink);
                border-radius: 999px;
                padding: 6px 12px;
                font-size: 12px;
                cursor: pointer;
            }
            .qtai-chatbot-generated-image-regen:hover:not(:disabled) {
                border-color: var(--qtai-tea-border);
                background: var(--qtai-tea-bg);
            }
            .qtai-chatbot-generated-image-regen:disabled {
                opacity: 0.6;
                cursor: wait;
            }
            .qtai-chatbot-generated-image-model {
                font-size: 11px;
                color: var(--qtai-ink-muted);
            }
            .qtai-chatbot-image-lightbox {
                position: fixed;
                inset: 0;
                z-index: 2147483647;
                background: rgba(15, 23, 42, 0.88);
                backdrop-filter: blur(4px);
                -webkit-backdrop-filter: blur(4px);
                display: none;
                align-items: center;
                justify-content: center;
                padding: 48px 20px 64px;
                box-sizing: border-box;
            }
            .qtai-chatbot-image-lightbox.active {
                display: flex;
            }
            html.qtai-chatbot-lightbox-open {
                overflow: hidden;
            }
            .qtai-chatbot-image-lightbox-img {
                max-width: min(96vw, 1400px);
                max-height: calc(100vh - 120px);
                width: auto;
                height: auto;
                object-fit: contain;
                border-radius: 10px;
                box-shadow: 0 24px 80px rgba(0, 0, 0, 0.45);
                user-select: none;
                -webkit-user-drag: none;
            }
            /* Cụm nút (tải + đóng) góc trên-phải — canh đều, đồng bộ kiểu tròn */
            .qtai-chatbot-image-lightbox-actions {
                position: absolute;
                top: 18px;
                right: 18px;
                z-index: 2;
                display: flex;
                align-items: center;
                gap: 10px;
                padding: 5px;
                border-radius: 999px;
                background: rgba(15, 23, 42, 0.35);
                backdrop-filter: blur(6px);
                -webkit-backdrop-filter: blur(6px);
            }
            .qtai-chatbot-image-lightbox-actions button {
                width: 42px;
                height: 42px;
                border: none;
                border-radius: 999px;
                background: rgba(255, 255, 255, 0.12);
                color: #fff;
                cursor: pointer;
                padding: 0;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                transition: background 0.15s ease, transform 0.15s ease;
            }
            .qtai-chatbot-image-lightbox-actions button:hover {
                background: rgba(255, 255, 255, 0.26);
                transform: scale(1.06);
            }
            .qtai-chatbot-image-lightbox-actions button:active {
                transform: scale(0.96);
            }
            .qtai-chatbot-image-lightbox-actions button svg { display: block; }
            .qtai-chatbot-image-lightbox-caption {
                position: absolute;
                left: 50%;
                bottom: 18px;
                transform: translateX(-50%);
                max-width: min(92vw, 720px);
                padding: 8px 14px;
                border-radius: 999px;
                background: rgba(15, 23, 42, 0.72);
                color: #f8fafc;
                font-size: 12px;
                text-align: center;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
            }
            .qtai-chatbot-compose textarea,
            .qtai-chatbot-app .qtai-chatbot-compose textarea,
            .qtai-chatbot-canvas-compose textarea,
            .qtai-chatbot-app .qtai-chatbot-canvas-compose textarea {
                flex: 1;
                width: 100%;
                border: none !important;
                border-radius: 0 !important;
                outline: none !important;
                box-shadow: none !important;
                -webkit-appearance: none;
                appearance: none;
                resize: none;
                min-height: 44px;
                max-height: 180px;
                padding: 8px 6px 6px 2px;
                margin: 0 !important;
                font-size: 14px;
                font-family: inherit;
                line-height: 1.45;
                background: transparent !important;
                color: var(--qtai-ink);
            }
            .qtai-chatbot-canvas-compose textarea,
            .qtai-chatbot-app .qtai-chatbot-canvas-compose textarea {
                min-height: 40px;
                max-height: 120px;
                font-size: 13px;
                padding-top: 8px !important;
            }
            .qtai-chatbot-compose textarea:focus,
            .qtai-chatbot-compose textarea:focus-visible,
            .qtai-chatbot-compose textarea:hover,
            .qtai-chatbot-compose textarea:active,
            .qtai-chatbot-canvas-compose textarea:focus,
            .qtai-chatbot-canvas-compose textarea:focus-visible,
            .qtai-chatbot-canvas-compose textarea:hover,
            .qtai-chatbot-canvas-compose textarea:active,
            .qtai-chatbot-app .qtai-chatbot-canvas-compose textarea:focus,
            .qtai-chatbot-app .qtai-chatbot-canvas-compose textarea:focus-visible,
            .qtai-chatbot-app .qtai-chatbot-canvas-compose textarea:hover,
            .qtai-chatbot-app .qtai-chatbot-canvas-compose textarea:active {
                border: none !important;
                outline: none !important;
                box-shadow: none !important;
                background: transparent !important;
            }
            .qtai-chatbot-compose textarea::placeholder,
            .qtai-chatbot-canvas-compose textarea::placeholder,
            .qtai-chatbot-app .qtai-chatbot-canvas-compose textarea::placeholder {
                color: var(--qtai-ink-muted);
                opacity: 0.85;
            }
            .qtai-chatbot-send-btn {
                flex-shrink: 0;
                border: none;
                border-radius: 50%;
                width: 44px;
                height: 44px;
                cursor: pointer;
                /* Màu phẳng, KHÔNG gradient — để nút ra đúng rgb(35,125,90) như yêu cầu,
                   gradient sẽ làm nửa dưới lệch tối đi so với mã màu. */
                background: var(--qtai-send);
                color: #fff;
                font-size: 18px;
                display: flex;
                align-items: center;
                justify-content: center;
                box-shadow: none;
                margin-bottom: 2px;
            }
            .qtai-chatbot-send-btn:hover:not(:disabled) {
                filter: brightness(1.05);
            }
            .qtai-chatbot-send-btn:disabled { opacity: 0.45; cursor: not-allowed; }
            .qtai-chatbot-send-btn.is-stop {
                background: #1e293b;
            }
            .qtai-chatbot-send-btn.is-stop:hover:not(:disabled) {
                background: #0f172a;
                filter: none;
            }
            .qtai-chatbot-compose-meta {
                display: none;
            }
            .qtai-chatbot-error {
                margin: 8px 16px 0;
                padding: 0;
                color: #b42318;
                font-size: 13px;
                display: none;
                line-height: 1.4;
            }
            .qtai-chatbot-error.active { display: block; }
            .qtai-chatbot-toast {
                position: fixed;
                left: 50%;
                bottom: 28px;
                transform: translateX(-50%) translateY(10px);
                padding: 9px 16px;
                border-radius: 999px;
                background: rgba(15, 23, 42, 0.92);
                color: #f8fafc;
                font-size: 13px;
                font-weight: 600;
                line-height: 1.2;
                opacity: 0;
                pointer-events: none;
                z-index: 2147483650;
                box-shadow: 0 10px 30px rgba(15, 23, 42, 0.22);
                transition: opacity 0.2s ease, transform 0.2s ease;
                white-space: nowrap;
            }
            .qtai-chatbot-toast.active {
                opacity: 1;
                transform: translateX(-50%) translateY(0);
            }
            .qtai-chatbot-toast.is-error {
                background: rgba(185, 28, 28, 0.94);
            }
            .qtai-chatbot-toast.is-success {
                background: rgba(5, 150, 105, 0.94);
            }
            .qtai-chatbot-login-notice {
                padding: 40px 24px;
                text-align: center;
                background: var(--qtai-tea-bg);
                color: var(--qtai-tea);
                font-size: 16px;
            }
            .qtai-chatbot-guest-notice {
                margin: 12px 16px 40px 10px;
                padding: 9px 10px 9px 14px;
                border-radius: 10px;
                background: #fff7ed;
                border: 1px solid #fed7aa;
                color: #9a3412;
                font-size: 13px;
                line-height: 1.45;
                display: flex;
                align-items: center;
                gap: 12px;
                flex-wrap: wrap;
            }
            .qtai-chatbot-guest-notice-text {
                flex: 1 1 200px;
                min-width: 0;
            }
            .qtai-chatbot-guest-notice-btn {
                flex: none;
                display: inline-flex;
                align-items: center;
                padding: 7px 16px;
                border-radius: 999px;
                background: #ea580c;
                color: #fff !important;
                font-weight: 600;
                font-size: 13px;
                line-height: 1.2;
                text-decoration: none !important;
                white-space: nowrap;
                box-shadow: 0 1px 2px rgba(234, 88, 12, 0.3);
                transition: background 0.15s ease, transform 0.1s ease;
            }
            .qtai-chatbot-guest-notice-btn:hover {
                background: #c2410c;
                color: #fff !important;
            }
            .qtai-chatbot-guest-notice-btn:active {
                transform: translateY(1px);
            }
            /* Trang chỉ dành cho thành viên, khách chưa đăng nhập: 2 nút dưới lời chào. */
            .qtai-member-cta {
                display: flex;
                justify-content: center;
                gap: 10px;
                margin: 14px auto 4px;
                max-width: 420px;
                width: 100%;
                pointer-events: auto; /* khối hero tắt pointer-events */
                user-select: none;
            }
            .qtai-member-cta-btn {
                flex: 0 1 auto;
                min-width: 140px;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                padding: 10px 22px;
                border-radius: 999px;
                font-size: 14.5px;
                font-weight: 600;
                line-height: 1.2;
                text-decoration: none !important;
                white-space: nowrap;
                border: 1.5px solid var(--qtai-brand);
                background: var(--qtai-white);
                color: var(--qtai-brand) !important;
                transition: background .15s ease, transform .1s ease;
            }
            .qtai-member-cta-btn:hover {
                background: #EAF5F0;
            }
            .qtai-member-cta-btn--primary,
            .qtai-member-cta-btn--primary:hover {
                background: var(--qtai-brand);
                color: #fff !important;
            }
            .qtai-member-cta-btn--primary:hover {
                background: #1B6649;
            }
            .qtai-member-cta-btn:active {
                transform: translateY(1px);
            }
            .qtai-chatbot-app.qtai-dark .qtai-member-cta-btn:not(.qtai-member-cta-btn--primary) {
                background: transparent;
                color: var(--qtai-brand-text) !important;
                border-color: var(--qtai-brand-text);
            }
            @media (max-width: 600px) {
                .qtai-member-cta {
                    padding: 0 16px;
                }
                .qtai-member-cta-btn {
                    flex: 1 1 0;
                    min-width: 0;
                    padding: 10px 12px;
                }
            }
            /* Điện thoại (≤600px): khung chat chiếm TOÀN màn hình như ChatGPT; sidebar
               trái thu vào nút hamburger, mở ra dạng drawer trượt từ trái. Sidebar phải
               "Công Cụ" cũng là drawer (xem media ≤900px). */
            @media (max-width: 600px) {
                .qtai-chatbot-history-mobile-btn { display: inline-flex; }
                .qtai-chatbot-app.qtai-history-drawer-open .qtai-chatbot-history-backdrop { display: block; }
                /* Sidebar trái -> drawer off-canvas */
                .qtai-chatbot-history,
                .qtai-chatbot-app.qtai-history-collapsed .qtai-chatbot-history {
                    position: fixed;
                    top: var(--qtai-app-vh-offset, 0px);
                    left: 0;
                    bottom: 0;
                    width: min(300px, 86vw);
                    min-width: 0;
                    max-height: none;
                    flex: none;
                    z-index: 56;
                    transform: translateX(-100%);
                    transition: transform .22s ease;
                    border-right: 1px solid var(--qtai-border-light);
                    border-bottom: none;
                    box-shadow: 16px 0 48px rgba(15, 23, 42, 0.30);
                }
                .qtai-chatbot-app.qtai-history-drawer-open .qtai-chatbot-history {
                    transform: translateX(0);
                }
                /* Ở màn hình nhỏ JS gỡ luôn trạng thái thu gọn rail (xem
                   loadHistorySidebarVisible) nên drawer luôn hiện đầy đủ nội dung. */
                .qtai-chatbot-main { min-height: 0; }
                .qtai-chatbot-main.is-hero-compose .qtai-chatbot-hero {
                    padding: 0 16px 8px;
                }
                .qtai-chatbot-main.is-hero-compose .qtai-chatbot-compose-slot {
                    padding: 0 12px 16px;
                }
                .qtai-chatbot-main.is-hero-compose .qtai-chatbot-input-shell {
                    border-radius: 22px;
                }
                .qtai-chatbot-hero-logo {
                    width: 56px;
                    height: 56px;
                }
                .qtai-chatbot-hero-text {
                    font-size: 14px;
                }
            }
            /* ===== Màn hình nhỏ (≤900px): giữ 2 cột như ChatGPT ===== */
            /* Thu hẹp sidebar trái để còn chỗ cho khung chat, và biến sidebar phải
               "Công Cụ" thành drawer trượt đè lên nội dung (không chiếm chiều ngang). */
            @media (max-width: 900px) {
                .qtai-chatbot-app { --qtai-sidebar-w: 244px; }
                .qtai-chatbot-samples {
                    position: fixed;
                    top: var(--qtai-app-vh-offset, 0px);
                    right: 0;
                    bottom: 0;
                    width: min(320px, 86vw);
                    max-height: none;
                    z-index: 55;
                    border-left: 1px solid var(--qtai-border-light);
                    box-shadow: -14px 0 44px rgba(15, 23, 42, 0.22);
                }
            }
            /* ===== "Chat với tài liệu" — nút phẳng đơn giản, chữ in hoa màu đen, canh trái ===== */
            .qtai-chatbot-docs-wrap > #qtai-chatbot-docs-btn {
                width: 100%;
                justify-content: flex-start;
                gap: 8px;
                padding: 9px 10px;
                border: 1px solid var(--qtai-border-light);
                border-radius: 8px;
                background: var(--qtai-white);
                color: var(--qtai-ink);
                font-size: 12px;
                font-weight: 600;
                letter-spacing: .04em;
                text-transform: uppercase;
                text-align: left;
                box-shadow: none;
                transition: background .15s ease, border-color .15s ease, color .15s ease;
            }
            .qtai-chatbot-docs-wrap > #qtai-chatbot-docs-btn:hover {
                transform: none;
                background: var(--qtai-paper-deep);
                border-color: var(--qtai-border);
                color: var(--qtai-ink);
                box-shadow: none;
                filter: none;
            }
            .qtai-chatbot-docs-wrap > #qtai-chatbot-docs-btn:active {
                transform: none;
                box-shadow: none;
            }
            button.qtai-chatbot-canvas-pill {
                appearance: none;
                border: 1px solid var(--qtai-border);
                background: var(--qtai-white);
                color: var(--qtai-ink-muted);
                border-radius: 999px;
                padding: 6px 12px;
                font-size: 11px;
                font-weight: 700;
                cursor: pointer;
                font-family: inherit;
                display: inline-flex;
                align-items: center;
                gap: 6px;
                transition: border-color 0.15s, background 0.15s, color 0.15s, box-shadow 0.15s;
            }
            button.qtai-chatbot-canvas-pill:hover {
                border-color: var(--qtai-tea-border);
                color: var(--qtai-tea);
                background: var(--qtai-tea-bg);
            }
            button.qtai-chatbot-canvas-pill[aria-pressed="true"] {
                border-color: var(--qtai-tea);
                background: linear-gradient(135deg, var(--qtai-tea) 0%, var(--qtai-tea-light) 100%);
                color: #fff;
                box-shadow: 0 4px 12px rgba(26, 77, 143, 0.22);
            }
            button.qtai-chatbot-deep-research-pill {
                appearance: none;
                border: 1px solid var(--qtai-border);
                background: var(--qtai-white);
                color: var(--qtai-ink-muted);
                border-radius: 999px;
                padding: 6px 12px;
                font-size: 11px;
                font-weight: 700;
                cursor: pointer;
                font-family: inherit;
                display: inline-flex;
                align-items: center;
                gap: 6px;
                transition: border-color 0.15s, background 0.15s, color 0.15s, box-shadow 0.15s;
            }
            button.qtai-chatbot-deep-research-pill:hover {
                border-color: #7c3aed;
                color: #6d28d9;
                background: #f5f3ff;
            }
            button.qtai-chatbot-deep-research-pill[aria-pressed="true"] {
                border-color: #7c3aed;
                background: linear-gradient(135deg, #7c3aed 0%, #6d28d9 100%);
                color: #fff;
                box-shadow: 0 4px 12px rgba(109, 40, 217, 0.22);
            }
            button.qtai-chatbot-auto-web-search-pill {
                appearance: none;
                border: 1px solid var(--qtai-border);
                background: var(--qtai-white);
                color: var(--qtai-ink-muted);
                border-radius: 999px;
                padding: 6px 12px;
                font-size: 11px;
                font-weight: 700;
                cursor: pointer;
                font-family: inherit;
                display: inline-flex;
                align-items: center;
                gap: 6px;
                transition: border-color 0.15s, background 0.15s, color 0.15s, box-shadow 0.15s;
            }
            button.qtai-chatbot-auto-web-search-pill:hover {
                border-color: #2563eb;
                color: #1d4ed8;
                background: #eff6ff;
            }
            button.qtai-chatbot-auto-web-search-pill[aria-pressed="true"] {
                border-color: #64748b;
                background: linear-gradient(135deg, #64748b 0%, #475569 100%);
                color: #fff;
                box-shadow: 0 4px 12px rgba(71, 85, 105, 0.22);
            }
            .qtai-chatbot-typing.lookup .qtai-chatbot-typing-dots span {
                background: #7c3aed;
            }
            .qtai-chatbot-research-badge.is-deep {
                background: #f5f3ff;
                border-color: #ddd6fe;
                color: #5b21b6;
            }
            .qtai-chatbot-research-badge.is-quick {
                background: #eff6ff;
                border-color: #bfdbfe;
                color: #1d4ed8;
            }
            .qtai-chatbot-canvas-chip {
                display: inline-flex;
                align-items: center;
                gap: 8px;
                margin-top: 10px;
                border: 1px solid var(--qtai-tea-border);
                background: var(--qtai-tea-bg);
                color: var(--qtai-tea);
                border-radius: 10px;
                padding: 10px 12px;
                font-size: 12px;
                font-weight: 600;
                cursor: pointer;
                font-family: inherit;
                text-align: left;
                max-width: 100%;
                transition: border-color 0.15s, box-shadow 0.15s, transform 0.15s;
            }
            .qtai-chatbot-canvas-chip:hover {
                border-color: var(--qtai-tea-light);
                box-shadow: 0 4px 12px rgba(26, 77, 143, 0.12);
                transform: translateY(-1px);
            }
            .qtai-chatbot-file-download-chip {
                display: inline-flex;
                align-items: center;
                gap: 8px;
                margin-top: 8px;
                margin-left: 8px;
                text-decoration: none;
                border: 1px solid var(--qtai-accent);
                background: var(--qtai-accent);
                color: #fff;
                border-radius: 10px;
                padding: 10px 14px;
                font-size: 12px;
                font-weight: 700;
                cursor: pointer;
                font-family: inherit;
                transition: box-shadow 0.15s, transform 0.15s, background 0.15s;
            }
            .qtai-chatbot-file-download-chip:hover {
                background: var(--qtai-accent-dark);
                border-color: var(--qtai-accent-dark);
                box-shadow: 0 4px 12px rgba(13, 148, 136, 0.28);
                transform: translateY(-1px);
            }
            .qtai-chatbot-file-download-ic { font-size: 14px; line-height: 1; }
            .qtai-chatbot-app.qtai-dark .qtai-chatbot-file-download-chip {
                color: #06251f;
            }
            .qtai-chatbot-canvas-summary {
                font-size: 14px;
                line-height: 1.6;
                color: var(--qtai-text-muted, #5a6b63);
                margin-bottom: 4px;
            }
            /* ==== Panel XEM TÀI LIỆU (split-screen gói Chat Với Tài Liệu) ==== */
            .qtai-docprev {
                flex: 0 0 46%;
                max-width: 46%;
                min-width: 0;
                display: flex;
                flex-direction: column;
                background: var(--qtai-paper-deep, #F5F1E8);
                border-left: 1px solid var(--qtai-border-light);
                overflow: hidden;
                /* Ép trình xem PDF gốc (iframe) về LIGHT -> hết nền đen khi hệ thống ở dark mode. */
                color-scheme: light;
                animation: qtaiDocprevIn 0.28s cubic-bezier(0.4, 0, 0.2, 1);
            }
            .qtai-docprev[hidden] { display: none; }
            @keyframes qtaiDocprevIn {
                from { opacity: 0; transform: translateX(24px); }
                to   { opacity: 1; transform: translateX(0); }
            }
            /* Đang mở tài liệu -> nhường chỗ cho gọn: ẩn cột công cụ phải.
               (Sidebar trái KHÔNG ẩn — chỉ thu gọn về thanh icon qua class qtai-history-collapsed.) */
            .qtai-docprev-open .qtai-chatbot-samples { display: none !important; }
            .qtai-docprev-head {
                display: flex;
                align-items: center;
                justify-content: space-between;
                gap: 8px;
                padding: 9px 12px 9px 16px;
                background: var(--qtai-white);
                border-bottom: 1px solid var(--qtai-border-light);
                flex-shrink: 0;
            }
            .qtai-docprev-title {
                font-size: 13.5px;
                font-weight: 600;
                color: var(--qtai-ink);
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
                display: flex;
                align-items: center;
                gap: 7px;
            }
            .qtai-docprev-actions { display: flex; align-items: center; gap: 4px; flex-shrink: 0; }
            .qtai-docprev-close, .qtai-docprev-dl {
                width: 30px; height: 30px;
                border-radius: 8px; border: none; cursor: pointer;
                display: inline-flex; align-items: center; justify-content: center;
                background: transparent; color: var(--qtai-ink-muted);
                font-size: 17px; line-height: 1; text-decoration: none;
                transition: background 0.15s ease, color 0.15s ease;
            }
            .qtai-docprev-close:hover, .qtai-docprev-dl:hover { background: var(--qtai-paper-deep); color: var(--qtai-ink); }
            .qtai-docprev-body { flex: 1 1 auto; min-height: 0; overflow: auto; background: var(--qtai-paper-deep, #F5F1E8); color-scheme: light; }
            .qtai-docprev-body iframe { width: 100%; height: 100%; border: none; display: block; background: #fff; color-scheme: light; }
            .qtai-docprev-body img { max-width: calc(100% - 32px); display: block; margin: 16px auto; box-shadow: 0 2px 14px rgba(15, 23, 42, 0.14); border-radius: 4px; }
            .qtai-docprev-text {
                margin: 0; padding: 22px 26px;
                white-space: pre-wrap; word-break: break-word;
                font-size: 13.5px; line-height: 1.65; color: var(--qtai-ink);
                background: #fff; min-height: 100%; box-sizing: border-box;
                font-family: 'Times New Roman', Georgia, serif;
            }
            .qtai-docprev-loading { display: flex; align-items: center; justify-content: center; height: 100%; padding: 24px; }
            @media (max-width: 900px) {
                .qtai-docprev {
                    position: fixed; inset: 0; z-index: 60;
                    flex-basis: 100%; max-width: 100%; border-left: none;
                }
            }
            .qtai-chatbot-canvas-overlay {
                position: fixed;
                inset: 0;
                z-index: 2147483647;
                background: rgba(15, 23, 42, 0.42);
                backdrop-filter: blur(4px);
                -webkit-backdrop-filter: blur(4px);
                display: none;
                align-items: stretch;
                justify-content: center;
                padding: 12px;
                box-sizing: border-box;
            }
            .qtai-chatbot-canvas-overlay.active {
                display: flex;
            }
            html.qtai-chatbot-canvas-open {
                overflow: hidden;
            }
            .qtai-chatbot-canvas-shell {
                width: min(1600px, 100%);
                height: 100%;
                background: var(--qtai-white);
                border-radius: 14px;
                border: 1px solid var(--qtai-border-light);
                box-shadow: 0 24px 80px rgba(15, 23, 42, 0.28);
                display: flex;
                flex-direction: row;
                overflow: hidden;
                min-height: 0;
            }
            .qtai-chatbot-canvas-chat {
                flex: 0 0 min(420px, 38vw);
                width: min(420px, 38vw);
                min-width: 300px;
                border-right: 1px solid var(--qtai-border-light);
                background: var(--qtai-paper);
                display: flex;
                flex-direction: column;
                min-height: 0;
            }
            .qtai-chatbot-canvas-chat-head {
                padding: 14px 16px;
                border-bottom: 1px solid var(--qtai-border-light);
                background: var(--qtai-white);
                flex-shrink: 0;
            }
            .qtai-chatbot-canvas-chat-head h4 {
                margin: 0;
                font-size: 14px;
                font-weight: 700;
                color: var(--qtai-tea);
            }
            .qtai-chatbot-canvas-chat-head p {
                margin: 4px 0 0;
                font-size: 11px;
                color: var(--qtai-ink-muted);
                line-height: 1.4;
            }
            .qtai-chatbot-canvas-messages {
                flex: 1 1 auto;
                min-height: 0;
                overflow-y: auto;
                padding: 12px 14px;
                display: flex;
                flex-direction: column;
                gap: 12px;
            }
            .qtai-chatbot-canvas-messages .qtai-chatbot-msg {
                max-width: 100%;
            }
            .qtai-chatbot-canvas-compose {
                padding: 12px 14px 14px;
                border-top: 1px solid var(--qtai-border-light);
                background: var(--qtai-white);
                flex-shrink: 0;
                position: relative;
                z-index: 3;
                overflow: visible;
            }
            .qtai-chatbot-canvas-compose .qtai-chatbot-input-shell {
                margin: 0;
                padding: 18px 10px 14px;
                border-radius: 18px;
            }
            .qtai-chatbot-canvas-compose .qtai-chatbot-island-wrap {
                max-width: calc(100% - 16px);
            }
            .qtai-chatbot-canvas-compose .qtai-chatbot-island {
                max-width: min(200px, 100%);
            }
            .qtai-chatbot-canvas-compose .qtai-chatbot-compose-inner {
                display: flex;
                gap: 8px;
                align-items: flex-end;
                padding: 0;
                border: none !important;
                outline: none !important;
                box-shadow: none !important;
                border-radius: 0;
                background: transparent;
            }
            .qtai-chatbot-canvas-compose .qtai-chatbot-attach-btn,
            .qtai-chatbot-canvas-compose .qtai-chatbot-send-btn {
                margin-bottom: 2px !important;
            }
            .qtai-chatbot-canvas-editor-pane {
                flex: 1 1 auto;
                min-width: 0;
                display: flex;
                flex-direction: column;
                background: #f3f4f6;
                min-height: 0;
                position: relative;
            }
            .qtai-chatbot-canvas-continue-overlay {
                position: absolute;
                left: 0;
                right: 0;
                bottom: 0;
                top: 49px;
                z-index: 30;
                display: flex;
                align-items: center;
                justify-content: center;
                padding: 24px;
                background: rgba(243, 244, 246, 0.72);
                backdrop-filter: blur(2px);
                opacity: 0;
                visibility: hidden;
                pointer-events: none;
                transition: opacity 0.2s ease, visibility 0.2s ease;
            }
            .qtai-chatbot-canvas-editor-pane.is-longform-continuing .qtai-chatbot-canvas-continue-overlay {
                opacity: 1;
                visibility: visible;
            }
            .qtai-chatbot-canvas-continue-inner {
                display: flex;
                flex-direction: column;
                align-items: center;
                gap: 10px;
                padding: 16px 20px;
                border-radius: 12px;
                background: rgba(255, 255, 255, 0.96);
                border: 1px solid var(--qtai-border-light);
                box-shadow: 0 10px 32px rgba(15, 23, 42, 0.12);
                max-width: 340px;
                text-align: center;
            }
            .qtai-chatbot-canvas-continue-spinner {
                width: 26px;
                height: 26px;
                border: 3px solid rgba(148, 163, 184, 0.25);
                border-top-color: var(--qtai-tea);
                border-radius: 50%;
                animation: qtai-canvas-code-spin 0.75s linear infinite;
            }
            .qtai-chatbot-canvas-continue-text {
                font-size: 13px;
                font-weight: 600;
                color: var(--qtai-ink);
                line-height: 1.45;
            }
            .qtai-chatbot-canvas-continue-hint {
                font-size: 11px;
                color: #64748b;
                line-height: 1.45;
            }
            .qtai-chatbot-canvas-editor-head {
                display: flex;
                align-items: center;
                gap: 10px;
                padding: 12px 16px;
                border-bottom: 1px solid var(--qtai-border-light);
                background: var(--qtai-white);
                flex-shrink: 0;
            }
            .qtai-chatbot-canvas-title {
                flex: 1;
                min-width: 0;
                font-size: 14px;
                font-weight: 700;
                color: var(--qtai-ink);
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
            }
            .qtai-chatbot-canvas-editor-actions {
                display: flex;
                align-items: center;
                gap: 8px;
                flex-shrink: 0;
            }
            button.qtai-chatbot-canvas-action {
                appearance: none;
                border: 1px solid var(--qtai-border);
                background: var(--qtai-white);
                color: var(--qtai-ink);
                border-radius: 8px;
                padding: 7px 12px;
                font-size: 12px;
                font-weight: 600;
                cursor: pointer;
                font-family: inherit;
            }
            button.qtai-chatbot-canvas-action:hover {
                border-color: var(--qtai-tea-border);
                background: var(--qtai-tea-bg);
                color: var(--qtai-tea);
            }
            button.qtai-chatbot-canvas-action.primary {
                background: linear-gradient(135deg, var(--qtai-tea) 0%, var(--qtai-tea-light) 100%);
                border-color: var(--qtai-tea);
                color: #fff;
            }
            button.qtai-chatbot-canvas-action.primary:hover {
                filter: brightness(1.05);
            }
            button.qtai-chatbot-canvas-action.save {
                border-color: var(--qtai-accent);
                color: var(--qtai-accent-dark);
            }
            button.qtai-chatbot-canvas-action.save.is-dirty {
                background: var(--qtai-accent-light);
            }
            button.qtai-chatbot-canvas-action.save:disabled {
                opacity: 0.65;
                cursor: wait;
            }
            .qtai-chatbot-canvas-download-wrap {
                position: relative;
            }
            .qtai-chatbot-canvas-download-menu {
                position: absolute;
                top: calc(100% + 6px);
                right: 0;
                min-width: 190px;
                padding: 6px;
                border: 1px solid var(--qtai-border-light);
                border-radius: 10px;
                background: var(--qtai-white);
                box-shadow: 0 12px 32px rgba(15, 23, 42, 0.14);
                z-index: 30;
            }
            .qtai-chatbot-canvas-download-menu[hidden] {
                display: none;
            }
            .qtai-chatbot-canvas-download-item {
                appearance: none;
                width: 100%;
                border: none;
                background: transparent;
                color: var(--qtai-ink);
                border-radius: 8px;
                padding: 8px 10px;
                font-size: 12px;
                font-weight: 600;
                text-align: left;
                cursor: pointer;
                font-family: inherit;
            }
            .qtai-chatbot-canvas-download-item:hover,
            .qtai-chatbot-canvas-download-item:focus-visible {
                background: var(--qtai-tea-bg);
                color: var(--qtai-tea);
                outline: none;
            }
            .qtai-chatbot-canvas-download-item.is-featured {
                background: rgba(13, 148, 136, 0.06);
            }
            .qtai-chatbot-canvas-download-divider {
                height: 1px;
                margin: 4px 0;
                background: var(--qtai-border-light);
            }
            .qtai-chatbot-canvas-editor-body {
                flex: 1 1 auto;
                min-height: 0;
                overflow: hidden;
            }
            .qtai-chatbot-canvas-editor-pane.is-code-mode {
                background: #181b20;
            }
            /* Thanh công cụ canvas code: dùng NỀN chủ đạo (giống .qtai-chatbot-canvas-chat-head) cho
               hài hòa với app — thay vì navy tối. Chỉ vùng SOẠN CODE bên dưới giữ nền tối. */
            .qtai-chatbot-canvas-editor-pane.is-code-mode .qtai-chatbot-canvas-editor-head {
                background: var(--qtai-white);
                border-bottom: 1px solid var(--qtai-border-light);
                padding: 10px 14px;
            }
            .qtai-chatbot-canvas-editor-pane.is-code-mode .qtai-chatbot-canvas-title {
                color: var(--qtai-ink);
                font-size: 13px;
                letter-spacing: 0.01em;
            }
            .qtai-chatbot-canvas-editor-pane.is-code-mode button.qtai-chatbot-canvas-action {
                background: var(--qtai-white);
                border-color: var(--qtai-border);
                color: var(--qtai-ink);
            }
            .qtai-chatbot-canvas-editor-pane.is-code-mode button.qtai-chatbot-canvas-action:hover {
                background: var(--qtai-tea-bg);
                border-color: var(--qtai-tea-border);
                color: var(--qtai-tea);
            }
            .qtai-chatbot-canvas-editor-pane.is-code-mode button.qtai-chatbot-canvas-action.save.is-dirty {
                border-color: var(--qtai-accent);
                color: var(--qtai-accent-light);
            }
            .qtai-chatbot-canvas-editor-pane.is-code-mode button.qtai-chatbot-canvas-action.primary {
                background: linear-gradient(135deg, var(--qtai-tea) 0%, var(--qtai-tea-light) 100%);
                border-color: transparent;
                color: #fff;
            }
            .qtai-chatbot-canvas-editor-pane.is-code-mode .qtai-chatbot-canvas-download-item[data-format="doc"],
            .qtai-chatbot-canvas-editor-pane.is-code-mode .qtai-chatbot-canvas-download-item[data-format="pdf"],
            .qtai-chatbot-canvas-editor-pane.is-code-mode .qtai-chatbot-canvas-download-item[data-format="pptx"],
            .qtai-chatbot-canvas-editor-pane.is-code-mode .qtai-chatbot-canvas-download-item[data-format="txt"],
            .qtai-chatbot-canvas-editor-pane.is-code-mode .qtai-chatbot-canvas-download-item[data-format="md"],
            .qtai-chatbot-canvas-editor-pane.is-code-mode .qtai-chatbot-canvas-download-divider {
                display: none;
            }
            /* ===== Canvas dashboard MARKETING (studio): ẩn tính năng code, chỉ Preview + PDF ===== */
            .qtai-chatbot-canvas-editor-pane.is-studio .qtai-chatbot-canvas-code-view-switch,
            .qtai-chatbot-canvas-editor-pane.is-studio #qtai-chatbot-canvas-copy,
            .qtai-chatbot-canvas-editor-pane.is-studio button.qtai-chatbot-canvas-action.save,
            .qtai-chatbot-canvas-editor-pane.is-studio .qtai-canvas-action-caret {
                display: none !important;
            }
            /* Trong menu tải: chỉ để PDF (ẩn HTML/doc/txt/md + divider) và un-hide PDF ở code-mode */
            .qtai-chatbot-canvas-editor-pane.is-studio.is-code-mode .qtai-chatbot-canvas-download-item[data-format="pdf"] {
                display: block !important;
            }
            .qtai-chatbot-canvas-editor-pane.is-studio .qtai-chatbot-canvas-download-item[data-format="html"],
            .qtai-chatbot-canvas-editor-pane.is-studio .qtai-chatbot-canvas-download-item[data-format="doc"],
            .qtai-chatbot-canvas-editor-pane.is-studio .qtai-chatbot-canvas-download-item[data-format="pptx"],
            .qtai-chatbot-canvas-editor-pane.is-studio .qtai-chatbot-canvas-download-item[data-format="txt"],
            .qtai-chatbot-canvas-editor-pane.is-studio .qtai-chatbot-canvas-download-item[data-format="md"],
            .qtai-chatbot-canvas-editor-pane.is-studio .qtai-chatbot-canvas-download-divider {
                display: none !important;
            }
            /* Ẩn thanh Preview dưới (PREVIEW · Live · sandbox · làm mới · mở tab) */
            .qtai-chatbot-canvas-editor-pane.is-studio .qtai-chatbot-canvas-code-panel-head {
                display: none !important;
            }
            /* Ẩn thanh header khung Preview cho MỌI canvas (game/web) — vô nghĩa với người dùng cuối */
            .qtai-chatbot-canvas-code-preview-wrap .qtai-chatbot-canvas-code-panel-head {
                display: none !important;
            }
            /* Nút "Mở tab" chỉ hiện ở dashboard studio (mặc định ẩn) */
            .qtai-canvas-studio-only {
                display: none;
            }
            .qtai-chatbot-canvas-editor-pane.is-studio .qtai-canvas-studio-only {
                display: inline-flex !important;
            }
            /* Nút Chia sẻ chỉ hiện khi Canvas ở chế độ CODE (game/trang web). */
            .qtai-canvas-code-only {
                display: none;
            }
            .qtai-chatbot-canvas-editor-pane.is-code-mode .qtai-canvas-code-only {
                display: inline-flex !important;
            }
            .qtai-chatbot-canvas-view-tabs {
                display: none;
                align-items: center;
                justify-content: space-between;
                gap: 12px;
                padding: 8px 12px;
                border-bottom: 1px solid #343b47;
                background: #1f242b;
                flex-shrink: 0;
            }
            .qtai-chatbot-canvas-editor-pane.is-code-mode .qtai-chatbot-canvas-view-tabs {
                display: flex;
            }
            .qtai-chatbot-canvas-code-toolbar-meta {
                display: flex;
                align-items: center;
                gap: 8px;
                min-width: 0;
            }
            .qtai-chatbot-canvas-code-file-badge {
                display: inline-flex;
                align-items: center;
                gap: 6px;
                padding: 4px 10px;
                border-radius: 6px;
                background: var(--qtai-tea-bg);
                border: 1px solid var(--qtai-border-light);
                color: var(--qtai-ink-muted);
                font-size: 11px;
                font-weight: 600;
                font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
                white-space: nowrap;
            }
            .qtai-chatbot-canvas-code-file-badge::before {
                content: '';
                width: 7px;
                height: 7px;
                border-radius: 50%;
                background: #22c55e;
                box-shadow: 0 0 0 2px rgba(34, 197, 94, 0.25);
            }
            .qtai-chatbot-canvas-code-view-switch {
                display: none;
                align-items: center;
                padding: 3px;
                border-radius: 8px;
                background: var(--qtai-tea-bg);
                border: 1px solid var(--qtai-border-light);
                gap: 2px;
                margin-right: 2px;
            }
            /* BỎ cụm CODE / PREVIEW / SPLIT: khách của app không phải dân code — xem mã nguồn
               không giúp được gì mà còn chiếm chỗ làm thanh công cụ chật. Canvas luôn ở Preview
               (mọi chỗ khác trong JS đều set 'preview'; chỉ 3 nút này mới đổi sang code/split). */
            .qtai-chatbot-canvas-editor-pane.is-code-mode .qtai-chatbot-canvas-code-view-switch {
                display: none;
            }
            .qtai-chatbot-canvas-view-tab {
                appearance: none;
                border: none;
                background: transparent;
                color: var(--qtai-ink-muted);
                border-radius: 6px;
                padding: 6px 14px;
                font-size: 11px;
                font-weight: 700;
                letter-spacing: 0.04em;
                text-transform: uppercase;
                cursor: pointer;
                font-family: inherit;
                transition: background 0.15s, color 0.15s;
            }
            .qtai-chatbot-canvas-view-tab:hover {
                color: var(--qtai-tea);
                background: rgba(0, 0, 0, 0.04);
            }
            .qtai-chatbot-canvas-view-tab.active {
                background: var(--qtai-white);
                color: var(--qtai-tea);
                box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12);
            }
            .qtai-chatbot-canvas-code-body {
                flex: 1 1 auto;
                min-height: 0;
                display: none;
                overflow: hidden;
                background: #181b20;
                position: relative;
            }
            .qtai-chatbot-canvas-code-updating-overlay {
                position: absolute;
                inset: 0;
                z-index: 25;
                display: flex;
                align-items: center;
                justify-content: center;
                padding: 24px;
                background: rgba(15, 18, 24, 0.55);
                backdrop-filter: blur(3px);
                opacity: 0;
                visibility: hidden;
                pointer-events: none;
                transition: opacity 0.2s ease, visibility 0.2s ease;
            }
            .qtai-chatbot-canvas-editor-pane.is-code-updating .qtai-chatbot-canvas-code-updating-overlay {
                opacity: 1;
                visibility: visible;
            }
            .qtai-chatbot-canvas-code-updating-inner {
                display: flex;
                flex-direction: column;
                align-items: center;
                gap: 12px;
                padding: 18px 22px;
                border-radius: 12px;
                background: rgba(31, 36, 43, 0.95);
                border: 1px solid #3d4654;
                box-shadow: 0 12px 40px rgba(0, 0, 0, 0.35);
                max-width: 320px;
                text-align: center;
            }
            .qtai-chatbot-canvas-code-updating-spinner {
                width: 28px;
                height: 28px;
                border: 3px solid rgba(148, 163, 184, 0.25);
                border-top-color: var(--qtai-tea-light);
                border-radius: 50%;
                animation: qtai-canvas-code-spin 0.75s linear infinite;
            }
            @keyframes qtai-canvas-code-spin {
                to { transform: rotate(360deg); }
            }
            .qtai-chatbot-canvas-code-updating-text {
                font-size: 13px;
                font-weight: 600;
                color: #e2e8f0;
                letter-spacing: 0.01em;
            }
            .qtai-chatbot-canvas-code-updating-hint {
                font-size: 11px;
                color: #8b98ab;
                line-height: 1.45;
            }
            .qtai-chatbot-canvas-editor-pane.is-code-updating .qtai-chatbot-canvas-code-preview {
                opacity: 0.72;
                filter: saturate(0.92);
                transition: opacity 0.2s, filter 0.2s;
            }
            .qtai-chatbot-canvas-editor-pane.is-code-updating .qtai-chatbot-canvas-code-preview-frame {
                animation: qtai-canvas-preview-pulse 1.4s ease-in-out infinite;
            }
            @keyframes qtai-canvas-preview-pulse {
                0%, 100% { box-shadow: inset 0 0 0 1px rgba(13, 148, 136, 0.08); }
                50% { box-shadow: inset 0 0 0 2px rgba(13, 148, 136, 0.35); }
            }
            .qtai-chatbot-canvas-editor-pane.is-code-updating .qtai-chatbot-canvas-code-file-badge::before {
                background: #f59e0b;
                box-shadow: 0 0 0 2px rgba(245, 158, 11, 0.35);
                animation: qtai-canvas-badge-pulse 1s ease-in-out infinite;
            }
            @keyframes qtai-canvas-badge-pulse {
                0%, 100% { opacity: 1; transform: scale(1); }
                50% { opacity: 0.55; transform: scale(0.85); }
            }
            .qtai-chatbot-canvas-editor-pane.is-code-updating .qtai-chatbot-canvas-code-panel-head span#qtai-chatbot-canvas-code-preview-label {
                color: var(--qtai-tea);
            }
            .qtai-chatbot-canvas-editor-pane.is-code-mode .qtai-chatbot-canvas-code-body {
                display: flex;
                flex-direction: column;
            }
            .qtai-chatbot-canvas-editor-pane.is-code-mode .qtai-chatbot-canvas-editor-body {
                display: none;
            }
            .qtai-chatbot-canvas-code-split {
                flex: 1 1 auto;
                min-height: 0;
                display: flex;
                overflow: hidden;
                gap: 0;
            }
            .qtai-chatbot-canvas-code-editor-wrap,
            .qtai-chatbot-canvas-code-preview-wrap {
                flex: 1 1 50%;
                min-width: 0;
                min-height: 0;
                display: flex;
                flex-direction: column;
                overflow: hidden;
            }
            .qtai-chatbot-canvas-code-editor-wrap {
                background: #1e1e1e;
                border-right: 1px solid #343b47;
            }
            .qtai-chatbot-canvas-code-panel-head {
                flex: 0 0 auto;
                display: flex;
                align-items: center;
                justify-content: space-between;
                padding: 6px 12px;
                font-size: 10px;
                font-weight: 700;
                letter-spacing: 0.06em;
                text-transform: uppercase;
                color: var(--qtai-ink-muted);
                background: var(--qtai-white);
                border-bottom: 1px solid var(--qtai-border-light);
            }
            .qtai-chatbot-canvas-code-panel-head > span:last-child:not(.qtai-chatbot-canvas-code-panel-actions) {
                font-weight: 500;
                text-transform: none;
                letter-spacing: 0;
                color: var(--qtai-ink-muted);
                font-size: 10px;
            }
            .qtai-chatbot-canvas-code-panel-actions > span:first-child {
                font-weight: 500;
                text-transform: none;
                letter-spacing: 0;
                color: var(--qtai-ink-muted);
                font-size: 10px;
            }
            .qtai-chatbot-canvas-code-editor-inner {
                flex: 1 1 auto;
                min-height: 0;
                overflow: hidden;
            }
            .qtai-chatbot-canvas-code-editor-inner .CodeMirror {
                height: 100% !important;
                font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
                font-size: 13px;
                line-height: 1.6;
            }
            .qtai-chatbot-canvas-code-preview-wrap {
                background: #eef1f5;
            }
            .qtai-chatbot-canvas-code-preview-frame {
                flex: 1 1 auto;
                min-height: 0;
                padding: 12px;
                background: #eef1f5;
                overflow: hidden;
            }
            .qtai-chatbot-canvas-code-preview {
                width: 100%;
                height: 100%;
                border: none;
                display: block;
                background: #fff;
                border-radius: 8px;
                box-shadow: 0 4px 24px rgba(15, 23, 42, 0.12), 0 0 0 1px rgba(15, 23, 42, 0.06);
            }
            .qtai-chatbot-canvas-editor-pane.view-code .qtai-chatbot-canvas-code-preview-wrap {
                display: none;
            }
            .qtai-chatbot-canvas-editor-pane.view-preview .qtai-chatbot-canvas-code-editor-wrap {
                display: none;
            }
            .qtai-chatbot-canvas-editor-pane.view-preview .qtai-chatbot-canvas-code-preview-wrap,
            .qtai-chatbot-canvas-editor-pane.view-code .qtai-chatbot-canvas-code-editor-wrap {
                flex-basis: 100%;
                border-right: none;
            }
            .qtai-chatbot-canvas-editor-pane.view-split .qtai-chatbot-canvas-code-editor-wrap {
                border-right: none;
            }
            .qtai-chatbot-canvas-code-split-resizer {
                flex: 0 0 5px;
                width: 5px;
                cursor: col-resize;
                background: #1f242b;
                position: relative;
                z-index: 2;
                transition: background 0.15s;
            }
            .qtai-chatbot-canvas-code-split-resizer::before {
                content: '';
                position: absolute;
                top: 50%;
                left: 50%;
                transform: translate(-50%, -50%);
                width: 3px;
                height: 32px;
                border-radius: 3px;
                background: #4a5568;
                opacity: 0.6;
                transition: opacity 0.15s, background 0.15s;
            }
            .qtai-chatbot-canvas-code-split-resizer:hover,
            .qtai-chatbot-canvas-code-split-resizer.is-dragging {
                background: #2a3039;
            }
            .qtai-chatbot-canvas-code-split-resizer:hover::before,
            .qtai-chatbot-canvas-code-split-resizer.is-dragging::before {
                opacity: 1;
                background: var(--qtai-tea-light);
            }
            .qtai-chatbot-canvas-editor-pane.view-code .qtai-chatbot-canvas-code-split-resizer,
            .qtai-chatbot-canvas-editor-pane.view-preview .qtai-chatbot-canvas-code-split-resizer {
                display: none;
            }
            .qtai-chatbot-canvas-code-panel-actions {
                display: inline-flex;
                align-items: center;
                gap: 4px;
            }
            .qtai-chatbot-canvas-code-panel-btn {
                appearance: none;
                border: 1px solid transparent;
                background: transparent;
                color: var(--qtai-ink-muted);
                width: 26px;
                height: 22px;
                border-radius: 5px;
                padding: 0;
                cursor: pointer;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                transition: background 0.15s, color 0.15s, border-color 0.15s;
            }
            .qtai-chatbot-canvas-code-panel-btn:hover {
                background: rgba(0, 0, 0, 0.05);
                color: var(--qtai-tea);
                border-color: var(--qtai-border-light);
            }
            .qtai-chatbot-canvas-code-panel-btn svg {
                width: 14px;
                height: 14px;
                stroke: currentColor;
                fill: none;
                stroke-width: 2;
                stroke-linecap: round;
                stroke-linejoin: round;
            }
            .qtai-chatbot-canvas-code-status {
                flex: 0 0 auto;
                display: flex;
                align-items: center;
                justify-content: space-between;
                gap: 12px;
                padding: 4px 12px;
                font-size: 11px;
                font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
                color: #6b7a90;
                background: #1a1d23;
                border-top: 1px solid #343b47;
            }
            .qtai-chatbot-canvas-code-status-left,
            .qtai-chatbot-canvas-code-status-right {
                display: inline-flex;
                align-items: center;
                gap: 10px;
                white-space: nowrap;
            }
            .qtai-chatbot-canvas-code-status-dot {
                width: 4px;
                height: 4px;
                border-radius: 50%;
                background: #4a5568;
            }
            .qtai-chatbot-canvas-code-status.is-dirty .qtai-chatbot-canvas-code-status-dot {
                background: #f59e0b;
                box-shadow: 0 0 6px rgba(245, 158, 11, 0.5);
            }
            .qtai-chatbot-canvas-editor-pane.is-code-mode .qtai-chatbot-canvas-code-editor-inner .CodeMirror {
                background: #1a1b26;
            }
            .qtai-chatbot-canvas-editor-pane.is-code-mode .qtai-chatbot-canvas-code-editor-inner .CodeMirror-gutters {
                background: #16161e;
                border-right: 1px solid #2a2d3a;
            }
            .qtai-chatbot-canvas-editor-pane.is-code-mode .qtai-chatbot-canvas-code-editor-inner .CodeMirror-linenumber {
                color: #565f89;
                padding: 0 8px 0 4px;
            }
            .qtai-chatbot-canvas-editor-pane.is-code-mode .qtai-chatbot-canvas-code-editor-inner .CodeMirror-cursor {
                border-left-color: #7aa2f7;
            }
            .qtai-chatbot-canvas-editor-pane.is-code-mode .qtai-chatbot-canvas-code-editor-inner .CodeMirror-selected {
                background: rgba(122, 162, 247, 0.18) !important;
            }
            .qtai-chatbot-canvas-editor-pane.is-code-mode .qtai-chatbot-canvas-code-editor-inner .CodeMirror-activeline-background {
                background: rgba(255, 255, 255, 0.03);
            }
            .qtai-chatbot-canvas-editor-pane.is-code-mode .qtai-chatbot-canvas-view-tab.active {
                background: linear-gradient(180deg, #3d4f5f 0%, #2d3642 100%);
                color: #fff;
                box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 1px 3px rgba(0, 0, 0, 0.25);
            }
            .qtai-canvas-action-icon {
                display: none;
            }
            .qtai-chatbot-canvas-editor-pane.is-code-mode button.qtai-chatbot-canvas-action .qtai-canvas-action-icon {
                display: inline-flex;
                margin-right: 5px;
                opacity: 0.85;
                vertical-align: -2px;
            }
            .qtai-chatbot-canvas-editor-pane.is-code-mode button.qtai-chatbot-canvas-action .qtai-canvas-action-icon svg {
                width: 14px;
                height: 14px;
                stroke: currentColor;
                fill: none;
                stroke-width: 2;
            }
            /* Code mode: HIỆN chữ cạnh icon. Chỉ mỗi icon thì khách không đoán được nút làm gì —
               nhất là nút Chia sẻ và Lưu (hai nút quan trọng nhất với giáo viên). */
            .qtai-chatbot-canvas-editor-pane.is-code-mode button.qtai-chatbot-canvas-action .qtai-canvas-action-label {
                display: inline;
                font-size: 12px;
                font-weight: 600;
                white-space: nowrap;
            }
            .qtai-chatbot-canvas-editor-pane.is-code-mode button.qtai-chatbot-canvas-action .qtai-canvas-action-icon {
                margin-right: 5px;
            }
            .qtai-chatbot-canvas-editor-pane.is-code-mode button.qtai-chatbot-canvas-action {
                padding: 7px 11px;
                line-height: 1.3;
            }
            /* Màn hẹp: quay lại chỉ-icon để thanh không tràn hoặc rớt dòng (tooltip vẫn còn ở title). */
            @media (max-width: 900px) {
                .qtai-chatbot-canvas-editor-pane.is-code-mode button.qtai-chatbot-canvas-action .qtai-canvas-action-label {
                    display: none;
                }
                .qtai-chatbot-canvas-editor-pane.is-code-mode button.qtai-chatbot-canvas-action .qtai-canvas-action-icon {
                    margin-right: 0;
                }
                .qtai-chatbot-canvas-editor-pane.is-code-mode button.qtai-chatbot-canvas-action {
                    padding: 8px 9px;
                    line-height: 0;
                }
            }
            .qtai-canvas-action-caret {
                font-size: 9px;
                opacity: 0.7;
                margin-left: 3px;
            }
            .qtai-chatbot-canvas-editor-pane.is-code-mode button.qtai-chatbot-canvas-action .qtai-canvas-action-caret {
                margin-left: 3px;
                line-height: 1;
            }
            .qtai-chatbot-canvas-editor-body .tox-tinymce {
                border: none !important;
                border-radius: 0 !important;
                height: 100% !important;
                overflow: visible !important;
            }
            .qtai-chatbot-canvas-editor-body .tox-tinymce .tox-editor-container {
                overflow: visible !important;
            }
            html.qtai-chatbot-canvas-open .tox.tox-silver-sink.tox-tinymce-aux,
            html.qtai-chatbot-canvas-open .tox-tinymce-aux,
            html.qtai-chatbot-canvas-open .tox-menu,
            html.qtai-chatbot-canvas-open .tox-pop,
            html.qtai-chatbot-canvas-open .tox-dialog-wrap,
            html.qtai-chatbot-canvas-open .tox-dialog {
                z-index: 2147483648 !important;
            }
            .qtai-chatbot-canvas-editor-body .tox .tox-toolbar-overlord,
            .qtai-chatbot-canvas-editor-body .tox .tox-toolbar__primary {
                flex-wrap: wrap;
            }
            .qtai-chatbot-canvas-editor-body .tox .tox-toolbar-overlord {
                padding-bottom: 2px;
            }
            .qtai-chatbot-canvas-editor-body .tox .tox-tbtn--select {
                max-width: 84px;
                min-width: 0 !important;
            }
            .qtai-chatbot-canvas-editor-body .tox .tox-tbtn--select .tox-tbtn__select-label {
                max-width: 64px;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }
            .qtai-chatbot-canvas-editor-body .tox .tox-tbtn--select[aria-label="Font sizes"],
            .qtai-chatbot-canvas-editor-body .tox .tox-tbtn--select[title="Font sizes"] {
                max-width: 58px;
            }
            .qtai-chatbot-canvas-editor-body .tox .tox-tbtn--select[aria-label="Font sizes"] .tox-tbtn__select-label,
            .qtai-chatbot-canvas-editor-body .tox .tox-tbtn--select[title="Font sizes"] .tox-tbtn__select-label {
                max-width: 40px;
            }
            @media (max-width: 900px) {
                .qtai-chatbot-canvas-overlay { padding: 0; }
                .qtai-chatbot-canvas-shell {
                    border-radius: 0;
                    flex-direction: column;
                }
                .qtai-chatbot-canvas-chat {
                    flex: 0 0 38vh;
                    width: 100%;
                    min-width: 0;
                    border-right: none;
                    border-bottom: 1px solid var(--qtai-border-light);
                }
            }

/* Mobile: section Flatsome (UX Builder) chứa khung chat có padding 30px mỗi bên -> khung soạn tin chỉ còn ~259px ở màn 390px.
 * Bỏ padding ngang của RIÊNG section chứa khung chat trên điện thoại (cột Flatsome vẫn giữ lề 15px như mọi trang). */
@media (max-width: 549px) {
    .section:has(#qtai-chatbot-app) {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

/* Trang có khối giới thiệu SEO (.tai-intro, vd /tram-ai/) đặt ngay trên app:
   gộp tiêu đề + app vừa đúng MỘT màn hình (trước đây app cao 100vh nên cả trang
   bị cuộn, H1 bị cắt và ô soạn tin bị đẩy xuống). Tiêu đề thu gọn, căn giữa. */
#main:has(> .tai-intro ~ #qtai-chatbot-app) {
    display: flex;
    flex-direction: column;
    height: 100vh;
    height: 100dvh;
    overflow: hidden;
}
body.admin-bar #main:has(> .tai-intro ~ #qtai-chatbot-app) {
    height: calc(100vh - 32px);
    height: calc(100dvh - 32px);
}
@media (max-width: 782px) {
    body.admin-bar #main:has(> .tai-intro ~ #qtai-chatbot-app) {
        height: calc(100vh - 46px);
        height: calc(100dvh - 46px);
    }
}
#main > .tai-intro:has(~ #qtai-chatbot-app) {
    flex: 0 0 auto;
    max-width: 920px;
    margin: 0 auto;
    padding: 14px 20px 12px;
    text-align: center;
}
#main > .tai-intro:has(~ #qtai-chatbot-app) h1.tai-h1 {
    font-size: 22px !important;
    margin: 0 0 4px !important;
}
#main > .tai-intro:has(~ #qtai-chatbot-app) p {
    font-size: 14px !important;
    line-height: 1.55 !important;
    max-width: none;
}
#main > .tai-intro ~ #qtai-chatbot-app {
    flex: 1 1 0;
    min-height: 0;
    height: auto;
    max-height: none;
}
@media (max-width: 849px) {
    #main > .tai-intro:has(~ #qtai-chatbot-app) {
        padding: 10px 14px 8px;
    }
    #main > .tai-intro:has(~ #qtai-chatbot-app) h1.tai-h1 {
        font-size: 17px !important;
        margin: 0 0 2px !important;
    }
    #main > .tai-intro:has(~ #qtai-chatbot-app) p {
        font-size: 12.5px !important;
        line-height: 1.45 !important;
        /* Hiện đủ đoạn mở đầu (trước đây cắt 2 dòng "…" -> mất chữ và mất link tải app). */
    }
}
/* Khung chat dưới khối tiêu đề: góc vuông, không bo tròn. */
#main > .tai-intro ~ #qtai-chatbot-app {
    border-radius: 0;
}

/* Trang chat miễn phí (shortcode khach>0: /tro-ly-ai/, trang trợ lý con) khi người xem ĐÃ có gói trả phí:
   khung chat đầy đủ nhưng giữ CÙNG chiều cao với chế độ khách (800px, tối đa 85% màn hình; điện thoại 80%)
   thay vì cao hết màn hình — trang có tiêu đề/nội dung SEO bên trên/dưới. */
.qtai-chatbot-app.qtai-trial-page:not(.qtai-guest-inst) {
    min-height: min(800px, 85vh) !important;
    height: min(800px, 85vh) !important;
    max-height: min(800px, 85vh) !important;
}
@media (max-width: 600px) {
    .qtai-chatbot-app.qtai-trial-page:not(.qtai-guest-inst) {
        min-height: min(800px, 80vh) !important;
        height: min(800px, 80vh) !important;
        max-height: min(800px, 80vh) !important;
    }
}
/* Tắt Canvas soạn thảo: ẩn nút bật Canvas trong menu "+" (server cũng không tự mở Canvas nữa). */
#qtai-chatbot-canvas-toggle { display: none !important; }