    * { box-sizing: border-box; }
    :root,
    body[data-chat-theme="bluewhite"] {
      --chat-page-bg: #f5f7fb;
      --chat-page-color: #0f172a;
      --chat-header-bg: linear-gradient(135deg, rgba(219,234,254,0.95), rgba(191,219,254,0.98));
      --chat-header-border: #bfdbfe;
      --chat-header-shadow: 0 10px 26px rgba(15,23,42,0.08);
      --chat-name-color: #0d47a1;
      --chat-desc-color: #5c6bc0;
      --chat-avatar-bg: linear-gradient(135deg, #1976d2, #1565c0);
      --chat-box-bg: #ffffff;
      --chat-body-bg: linear-gradient(180deg, #f8fbff 0%, #f8fafc 38%, #f9fafb 100%);
      --chat-user-bg: linear-gradient(135deg, #1976d2, #1565c0);
      --chat-user-color: #fff;
      --chat-user-meta: rgba(255,255,255,0.86);
      --chat-bot-bg: rgba(255,255,255,0.96);
      --chat-bot-color: #334155;
      --chat-bot-border: #dbeafe;
      --chat-bot-meta: #64748b;
      --chat-welcome-bg: linear-gradient(135deg, rgba(255,255,255,0.98), rgba(239,246,255,0.98));
      --chat-welcome-border: #bfdbfe;
      --chat-welcome-meta: #2563eb;
      --chat-welcome-text: #1e293b;
      --chat-security-bg: #fffbeb;
      --chat-security-color: #92400e;
      --chat-security-border: #fde68a;
      --chat-intake-bg: #f8fafc;
      --chat-intake-border: #e2e8f0;
      --chat-intake-hint: #475569;
      --chat-chip-bg: #fff;
      --chat-chip-border: #cbd5e1;
      --chat-chip-color: #334155;
      --chat-chip-active-bg: #e3f2fd;
      --chat-chip-active-border: #1976d2;
      --chat-chip-active-color: #0d47a1;
      --chat-ticket-toggle-bg: #eff6ff;
      --chat-ticket-toggle-color: #1d4ed8;
      --chat-ticket-toggle-border: #bfdbfe;
      --chat-ticket-panel-bg: #fff;
      --chat-ticket-panel-border: #e2e8f0;
      --chat-footer-bg: #fff;
      --chat-footer-border: #e5e7eb;
      --chat-footer-shadow: 0 -8px 22px rgba(15,23,42,0.05);
      --chat-input-bg: #f8fafc;
      --chat-input-border: #bfdbfe;
      --chat-input-color: #0f172a;
      --chat-input-focus-border: #2563eb;
      --chat-input-focus-shadow: 0 0 0 3px rgba(37,99,235,0.12);
      --chat-btn-primary-bg: linear-gradient(135deg, #2563eb, #1d4ed8);
      --chat-btn-primary-color: #fff;
      --chat-btn-primary-shadow: 0 10px 22px rgba(37,99,235,0.22);
      --chat-btn-attach-bg: #eff6ff;
      --chat-btn-attach-color: #1d4ed8;
      --chat-btn-attach-border: #bfdbfe;
      --chat-team-badge-bg: linear-gradient(135deg, #4f46e5, #22d3ee);
      --chat-team-badge-color: #fff;
      --chat-banner-wrap-bg: rgba(255,255,255,0.5);
      --chat-banner-wrap-border: rgba(255,255,255,0.8);
      --chat-pending-bg: #f1f5f9;
      --chat-pending-border: #e2e8f0;
    }
    body[data-chat-theme="blackgold"] {
      --chat-page-bg: #0a0908;
      --chat-page-color: #f5e6c8;
      --chat-header-bg: linear-gradient(135deg, #1a1612 0%, #2d2418 55%, #1a1612 100%);
      --chat-header-border: #5c4a2a;
      --chat-header-shadow: 0 12px 28px rgba(0,0,0,0.45);
      --chat-name-color: #f5d78e;
      --chat-desc-color: #c9b896;
      --chat-avatar-bg: linear-gradient(135deg, #b8860b, #8b6914);
      --chat-box-bg: #12100e;
      --chat-body-bg: linear-gradient(180deg, #0f0d0b 0%, #14110e 50%, #0a0908 100%);
      --chat-user-bg: linear-gradient(135deg, #c9a227, #8b6914);
      --chat-user-color: #1a1408;
      --chat-user-meta: rgba(26,20,8,0.75);
      --chat-bot-bg: rgba(28,24,20,0.96);
      --chat-bot-color: #e8dcc8;
      --chat-bot-border: #5c4a2a;
      --chat-bot-meta: #a89878;
      --chat-welcome-bg: linear-gradient(135deg, rgba(36,30,24,0.98), rgba(28,24,18,0.98));
      --chat-welcome-border: #8b7355;
      --chat-welcome-meta: #d4af37;
      --chat-welcome-text: #f0e6d2;
      --chat-security-bg: #2a2418;
      --chat-security-color: #e8c878;
      --chat-security-border: #5c4a2a;
      --chat-intake-bg: #14110e;
      --chat-intake-border: #3d3428;
      --chat-intake-hint: #c9b896;
      --chat-chip-bg: #1c1814;
      --chat-chip-border: #5c4a2a;
      --chat-chip-color: #e8dcc8;
      --chat-chip-active-bg: #3d3020;
      --chat-chip-active-border: #d4af37;
      --chat-chip-active-color: #f5d78e;
      --chat-ticket-toggle-bg: #2a2418;
      --chat-ticket-toggle-color: #f5d78e;
      --chat-ticket-toggle-border: #8b7355;
      --chat-ticket-panel-bg: #1c1814;
      --chat-ticket-panel-border: #5c4a2a;
      --chat-footer-bg: #12100e;
      --chat-footer-border: #3d3428;
      --chat-footer-shadow: 0 -8px 24px rgba(0,0,0,0.35);
      --chat-input-bg: #1c1814;
      --chat-input-border: #5c4a2a;
      --chat-input-color: #f5e6c8;
      --chat-input-focus-border: #d4af37;
      --chat-input-focus-shadow: 0 0 0 3px rgba(212,175,55,0.2);
      --chat-btn-primary-bg: linear-gradient(135deg, #d4af37, #a67c00);
      --chat-btn-primary-color: #1a1408;
      --chat-btn-primary-shadow: 0 10px 22px rgba(212,175,55,0.25);
      --chat-btn-attach-bg: #2a2418;
      --chat-btn-attach-color: #f5d78e;
      --chat-btn-attach-border: #8b7355;
      --chat-team-badge-bg: linear-gradient(135deg, #8b6914, #d4af37);
      --chat-team-badge-color: #1a1408;
      --chat-banner-wrap-bg: rgba(28,24,20,0.6);
      --chat-banner-wrap-border: #5c4a2a;
      --chat-pending-bg: #1c1814;
      --chat-pending-border: #3d3428;
    }
    body[data-chat-theme="sapphire"] {
      --chat-page-bg: #061428;
      --chat-page-color: #dbeafe;
      --chat-header-bg: linear-gradient(135deg, #0c2d5c 0%, #1e40af 50%, #172554 100%);
      --chat-header-border: #1d4ed8;
      --chat-header-shadow: 0 12px 28px rgba(0,20,80,0.35);
      --chat-name-color: #93c5fd;
      --chat-desc-color: #60a5fa;
      --chat-avatar-bg: linear-gradient(135deg, #2563eb, #1e3a8a);
      --chat-box-bg: #0a1628;
      --chat-body-bg: linear-gradient(180deg, #071428 0%, #0c1f3d 45%, #061428 100%);
      --chat-user-bg: linear-gradient(135deg, #3b82f6, #1d4ed8);
      --chat-user-color: #eff6ff;
      --chat-user-meta: rgba(239,246,255,0.8);
      --chat-bot-bg: rgba(15,35,70,0.95);
      --chat-bot-color: #bfdbfe;
      --chat-bot-border: #1e40af;
      --chat-bot-meta: #60a5fa;
      --chat-welcome-bg: linear-gradient(135deg, rgba(15,40,85,0.98), rgba(12,30,65,0.98));
      --chat-welcome-border: #2563eb;
      --chat-welcome-meta: #60a5fa;
      --chat-welcome-text: #dbeafe;
      --chat-security-bg: #0f2847;
      --chat-security-color: #93c5fd;
      --chat-security-border: #1e40af;
      --chat-intake-bg: #0a1628;
      --chat-intake-border: #1e3a8a;
      --chat-intake-hint: #93c5fd;
      --chat-chip-bg: #0f2847;
      --chat-chip-border: #2563eb;
      --chat-chip-color: #dbeafe;
      --chat-chip-active-bg: #1e3a8a;
      --chat-chip-active-border: #60a5fa;
      --chat-chip-active-color: #eff6ff;
      --chat-ticket-toggle-bg: #0f2847;
      --chat-ticket-toggle-color: #93c5fd;
      --chat-ticket-toggle-border: #2563eb;
      --chat-ticket-panel-bg: #0f2847;
      --chat-ticket-panel-border: #1e40af;
      --chat-footer-bg: #0a1628;
      --chat-footer-border: #1e3a8a;
      --chat-footer-shadow: 0 -8px 24px rgba(0,20,80,0.3);
      --chat-input-bg: #0f2847;
      --chat-input-border: #2563eb;
      --chat-input-color: #eff6ff;
      --chat-input-focus-border: #60a5fa;
      --chat-input-focus-shadow: 0 0 0 3px rgba(37,99,235,0.25);
      --chat-btn-primary-bg: linear-gradient(135deg, #3b82f6, #1d4ed8);
      --chat-btn-primary-color: #fff;
      --chat-btn-primary-shadow: 0 10px 22px rgba(37,99,235,0.35);
      --chat-btn-attach-bg: #0f2847;
      --chat-btn-attach-color: #93c5fd;
      --chat-btn-attach-border: #2563eb;
      --chat-team-badge-bg: linear-gradient(135deg, #1d4ed8, #38bdf8);
      --chat-team-badge-color: #fff;
      --chat-banner-wrap-bg: rgba(15,35,70,0.55);
      --chat-banner-wrap-border: #2563eb;
      --chat-pending-bg: #0f2847;
      --chat-pending-border: #1e3a8a;
    }
    body[data-chat-theme="azure"] {
      --chat-page-bg: #e0f2fe;
      --chat-page-color: #0c4a6e;
      --chat-header-bg: linear-gradient(135deg, #bae6fd 0%, #7dd3fc 45%, #38bdf8 100%);
      --chat-header-border: #0ea5e9;
      --chat-header-shadow: 0 10px 26px rgba(14,116,144,0.15);
      --chat-name-color: #075985;
      --chat-desc-color: #0369a1;
      --chat-avatar-bg: linear-gradient(135deg, #0ea5e9, #0284c7);
      --chat-box-bg: #f0f9ff;
      --chat-body-bg: linear-gradient(180deg, #ecfeff 0%, #e0f2fe 40%, #f0f9ff 100%);
      --chat-user-bg: linear-gradient(135deg, #0ea5e9, #0284c7);
      --chat-user-color: #fff;
      --chat-user-meta: rgba(255,255,255,0.88);
      --chat-bot-bg: rgba(255,255,255,0.94);
      --chat-bot-color: #0c4a6e;
      --chat-bot-border: #7dd3fc;
      --chat-bot-meta: #0369a1;
      --chat-welcome-bg: linear-gradient(135deg, rgba(255,255,255,0.98), rgba(224,242,254,0.98));
      --chat-welcome-border: #38bdf8;
      --chat-welcome-meta: #0284c7;
      --chat-welcome-text: #0c4a6e;
      --chat-security-bg: #fef9c3;
      --chat-security-color: #854d0e;
      --chat-security-border: #fde047;
      --chat-intake-bg: #ecfeff;
      --chat-intake-border: #a5f3fc;
      --chat-intake-hint: #0369a1;
      --chat-chip-bg: #fff;
      --chat-chip-border: #7dd3fc;
      --chat-chip-color: #0c4a6e;
      --chat-chip-active-bg: #bae6fd;
      --chat-chip-active-border: #0284c7;
      --chat-chip-active-color: #075985;
      --chat-ticket-toggle-bg: #e0f2fe;
      --chat-ticket-toggle-color: #0369a1;
      --chat-ticket-toggle-border: #38bdf8;
      --chat-ticket-panel-bg: #fff;
      --chat-ticket-panel-border: #7dd3fc;
      --chat-footer-bg: #f0f9ff;
      --chat-footer-border: #bae6fd;
      --chat-footer-shadow: 0 -8px 22px rgba(14,116,144,0.08);
      --chat-input-bg: #fff;
      --chat-input-border: #7dd3fc;
      --chat-input-color: #0c4a6e;
      --chat-input-focus-border: #0ea5e9;
      --chat-input-focus-shadow: 0 0 0 3px rgba(14,165,233,0.18);
      --chat-btn-primary-bg: linear-gradient(135deg, #0ea5e9, #0284c7);
      --chat-btn-primary-color: #fff;
      --chat-btn-primary-shadow: 0 10px 22px rgba(14,165,233,0.25);
      --chat-btn-attach-bg: #e0f2fe;
      --chat-btn-attach-color: #0369a1;
      --chat-btn-attach-border: #7dd3fc;
      --chat-team-badge-bg: linear-gradient(135deg, #0284c7, #22d3ee);
      --chat-team-badge-color: #fff;
      --chat-banner-wrap-bg: rgba(255,255,255,0.55);
      --chat-banner-wrap-border: #7dd3fc;
      --chat-pending-bg: #e0f2fe;
      --chat-pending-border: #bae6fd;
    }
    body[data-chat-theme="mecha"] {
      --chat-page-bg: #0a0a12;
      --chat-page-color: #e2e8f0;
      --chat-header-bg: linear-gradient(135deg, #1a1030 0%, #0f172a 40%, #1e1b4b 100%);
      --chat-header-border: #22d3ee;
      --chat-header-shadow: 0 12px 32px rgba(0,245,255,0.12);
      --chat-name-color: #67e8f9;
      --chat-desc-color: #c084fc;
      --chat-avatar-bg: linear-gradient(135deg, #06b6d4, #a855f7);
      --chat-box-bg: #0f0f18;
      --chat-body-bg: linear-gradient(180deg, #0a0a12 0%, #12121f 50%, #0a0a12 100%);
      --chat-user-bg: linear-gradient(135deg, #06b6d4, #8b5cf6);
      --chat-user-color: #fff;
      --chat-user-meta: rgba(255,255,255,0.82);
      --chat-bot-bg: rgba(20,20,35,0.95);
      --chat-bot-color: #e2e8f0;
      --chat-bot-border: #6366f1;
      --chat-bot-meta: #a5b4fc;
      --chat-welcome-bg: linear-gradient(135deg, rgba(30,20,50,0.98), rgba(15,23,42,0.98));
      --chat-welcome-border: #22d3ee;
      --chat-welcome-meta: #22d3ee;
      --chat-welcome-text: #f1f5f9;
      --chat-security-bg: rgba(236,72,153,0.12);
      --chat-security-color: #f9a8d4;
      --chat-security-border: #ec4899;
      --chat-intake-bg: #12121f;
      --chat-intake-border: #4338ca;
      --chat-intake-hint: #a5b4fc;
      --chat-chip-bg: #1a1a2e;
      --chat-chip-border: #6366f1;
      --chat-chip-color: #e2e8f0;
      --chat-chip-active-bg: rgba(6,182,212,0.2);
      --chat-chip-active-border: #22d3ee;
      --chat-chip-active-color: #67e8f9;
      --chat-ticket-toggle-bg: rgba(99,102,241,0.2);
      --chat-ticket-toggle-color: #c084fc;
      --chat-ticket-toggle-border: #8b5cf6;
      --chat-ticket-panel-bg: #1a1a2e;
      --chat-ticket-panel-border: #6366f1;
      --chat-footer-bg: #0f0f18;
      --chat-footer-border: #4338ca;
      --chat-footer-shadow: 0 -8px 28px rgba(34,211,238,0.08);
      --chat-input-bg: #1a1a2e;
      --chat-input-border: #6366f1;
      --chat-input-color: #f1f5f9;
      --chat-input-focus-border: #22d3ee;
      --chat-input-focus-shadow: 0 0 0 3px rgba(34,211,238,0.2);
      --chat-btn-primary-bg: linear-gradient(135deg, #06b6d4, #8b5cf6);
      --chat-btn-primary-color: #fff;
      --chat-btn-primary-shadow: 0 10px 24px rgba(139,92,246,0.35);
      --chat-btn-attach-bg: #1a1a2e;
      --chat-btn-attach-color: #67e8f9;
      --chat-btn-attach-border: #6366f1;
      --chat-team-badge-bg: linear-gradient(135deg, #06b6d4, #ec4899);
      --chat-team-badge-color: #fff;
      --chat-banner-wrap-bg: rgba(26,26,46,0.65);
      --chat-banner-wrap-border: #22d3ee;
      --chat-pending-bg: #1a1a2e;
      --chat-pending-border: #4338ca;
    }
    body[data-chat-theme="orange"] {
      --chat-page-bg: #fff7ed;
      --chat-page-color: #431407;
      --chat-header-bg: linear-gradient(135deg, #ffedd5 0%, #fed7aa 45%, #fdba74 100%);
      --chat-header-border: #fb923c;
      --chat-header-shadow: 0 10px 26px rgba(234,88,12,0.12);
      --chat-name-color: #c2410c;
      --chat-desc-color: #ea580c;
      --chat-avatar-bg: linear-gradient(135deg, #f97316, #ea580c);
      --chat-box-bg: #fffbeb;
      --chat-body-bg: linear-gradient(180deg, #fff7ed 0%, #ffedd5 40%, #fffbeb 100%);
      --chat-user-bg: linear-gradient(135deg, #f97316, #ea580c);
      --chat-user-color: #fff;
      --chat-user-meta: rgba(255,255,255,0.88);
      --chat-bot-bg: rgba(255,255,255,0.96);
      --chat-bot-color: #7c2d12;
      --chat-bot-border: #fdba74;
      --chat-bot-meta: #c2410c;
      --chat-welcome-bg: linear-gradient(135deg, rgba(255,255,255,0.98), rgba(255,237,213,0.98));
      --chat-welcome-border: #fb923c;
      --chat-welcome-meta: #ea580c;
      --chat-welcome-text: #431407;
      --chat-security-bg: #fef3c7;
      --chat-security-color: #b45309;
      --chat-security-border: #fcd34d;
      --chat-intake-bg: #ffedd5;
      --chat-intake-border: #fdba74;
      --chat-intake-hint: #9a3412;
      --chat-chip-bg: #fff;
      --chat-chip-border: #fdba74;
      --chat-chip-color: #7c2d12;
      --chat-chip-active-bg: #ffedd5;
      --chat-chip-active-border: #ea580c;
      --chat-chip-active-color: #c2410c;
      --chat-ticket-toggle-bg: #ffedd5;
      --chat-ticket-toggle-color: #c2410c;
      --chat-ticket-toggle-border: #fb923c;
      --chat-ticket-panel-bg: #fff;
      --chat-ticket-panel-border: #fdba74;
      --chat-footer-bg: #fffbeb;
      --chat-footer-border: #fed7aa;
      --chat-footer-shadow: 0 -8px 22px rgba(234,88,12,0.08);
      --chat-input-bg: #fff;
      --chat-input-border: #fdba74;
      --chat-input-color: #431407;
      --chat-input-focus-border: #f97316;
      --chat-input-focus-shadow: 0 0 0 3px rgba(249,115,22,0.18);
      --chat-btn-primary-bg: linear-gradient(135deg, #f97316, #ea580c);
      --chat-btn-primary-color: #fff;
      --chat-btn-primary-shadow: 0 10px 22px rgba(234,88,12,0.25);
      --chat-btn-attach-bg: #ffedd5;
      --chat-btn-attach-color: #c2410c;
      --chat-btn-attach-border: #fdba74;
      --chat-team-badge-bg: linear-gradient(135deg, #ea580c, #fbbf24);
      --chat-team-badge-color: #fff;
      --chat-banner-wrap-bg: rgba(255,255,255,0.55);
      --chat-banner-wrap-border: #fdba74;
      --chat-pending-bg: #ffedd5;
      --chat-pending-border: #fed7aa;
    }
    body[data-chat-theme="mint"] {
      --chat-page-bg: #f0fdfa;
      --chat-page-color: #134e4a;
      --chat-header-bg: linear-gradient(135deg, #ccfbf1 0%, #99f6e4 50%, #5eead4 100%);
      --chat-header-border: #5eead4;
      --chat-header-shadow: 0 10px 26px rgba(15,118,110,0.12);
      --chat-name-color: #0f766e;
      --chat-desc-color: #0d9488;
      --chat-avatar-bg: linear-gradient(135deg, #14b8a6, #0f766e);
      --chat-box-bg: #ffffff;
      --chat-body-bg: linear-gradient(180deg, #f0fdfa 0%, #ecfeff 40%, #f8fafc 100%);
      --chat-user-bg: linear-gradient(135deg, #14b8a6, #0d9488);
      --chat-user-color: #fff;
      --chat-user-meta: rgba(255,255,255,0.86);
      --chat-bot-bg: rgba(255,255,255,0.96);
      --chat-bot-color: #115e59;
      --chat-bot-border: #99f6e4;
      --chat-bot-meta: #0f766e;
      --chat-welcome-bg: linear-gradient(135deg, rgba(255,255,255,0.98), rgba(204,251,241,0.98));
      --chat-welcome-border: #5eead4;
      --chat-welcome-meta: #0f766e;
      --chat-welcome-text: #134e4a;
      --chat-security-bg: #ecfdf5;
      --chat-security-color: #047857;
      --chat-security-border: #a7f3d0;
      --chat-intake-bg: #f0fdfa;
      --chat-intake-border: #99f6e4;
      --chat-intake-hint: #0f766e;
      --chat-chip-bg: #fff;
      --chat-chip-border: #99f6e4;
      --chat-chip-color: #115e59;
      --chat-chip-active-bg: #ccfbf1;
      --chat-chip-active-border: #14b8a6;
      --chat-chip-active-color: #0f766e;
      --chat-ticket-toggle-bg: #ccfbf1;
      --chat-ticket-toggle-color: #0f766e;
      --chat-ticket-toggle-border: #5eead4;
      --chat-ticket-panel-bg: #fff;
      --chat-ticket-panel-border: #99f6e4;
      --chat-footer-bg: #ffffff;
      --chat-footer-border: #ccfbf1;
      --chat-footer-shadow: 0 -8px 22px rgba(15,118,110,0.06);
      --chat-input-bg: #f0fdfa;
      --chat-input-border: #99f6e4;
      --chat-input-color: #134e4a;
      --chat-input-focus-border: #14b8a6;
      --chat-input-focus-shadow: 0 0 0 3px rgba(20,184,166,0.18);
      --chat-btn-primary-bg: linear-gradient(135deg, #14b8a6, #0f766e);
      --chat-btn-primary-color: #fff;
      --chat-btn-primary-shadow: 0 10px 22px rgba(15,118,110,0.22);
      --chat-btn-attach-bg: #ccfbf1;
      --chat-btn-attach-color: #0f766e;
      --chat-btn-attach-border: #99f6e4;
      --chat-team-badge-bg: linear-gradient(135deg, #14b8a6, #06b6d4);
      --chat-team-badge-color: #fff;
      --chat-banner-wrap-bg: rgba(255,255,255,0.55);
      --chat-banner-wrap-border: #99f6e4;
      --chat-pending-bg: #ccfbf1;
      --chat-pending-border: #99f6e4;
    }
    body[data-chat-theme="rose"] {
      --chat-page-bg: #fff1f2;
      --chat-page-color: #881337;
      --chat-header-bg: linear-gradient(135deg, #ffe4e6 0%, #fecdd3 50%, #fda4af 100%);
      --chat-header-border: #fb7185;
      --chat-header-shadow: 0 10px 26px rgba(225,29,72,0.12);
      --chat-name-color: #be123c;
      --chat-desc-color: #e11d48;
      --chat-avatar-bg: linear-gradient(135deg, #f43f5e, #e11d48);
      --chat-box-bg: #fff;
      --chat-body-bg: linear-gradient(180deg, #fff1f2 0%, #ffe4e6 40%, #fffafb 100%);
      --chat-user-bg: linear-gradient(135deg, #f43f5e, #e11d48);
      --chat-user-color: #fff;
      --chat-user-meta: rgba(255,255,255,0.88);
      --chat-bot-bg: rgba(255,255,255,0.96);
      --chat-bot-color: #9f1239;
      --chat-bot-border: #fecdd3;
      --chat-bot-meta: #be123c;
      --chat-welcome-bg: linear-gradient(135deg, rgba(255,255,255,0.98), rgba(255,228,230,0.98));
      --chat-welcome-border: #fb7185;
      --chat-welcome-meta: #be123c;
      --chat-welcome-text: #881337;
      --chat-security-bg: #fff7ed;
      --chat-security-color: #9a3412;
      --chat-security-border: #fed7aa;
      --chat-intake-bg: #fff1f2;
      --chat-intake-border: #fecdd3;
      --chat-intake-hint: #be123c;
      --chat-chip-bg: #fff;
      --chat-chip-border: #fecdd3;
      --chat-chip-color: #9f1239;
      --chat-chip-active-bg: #ffe4e6;
      --chat-chip-active-border: #f43f5e;
      --chat-chip-active-color: #be123c;
      --chat-ticket-toggle-bg: #ffe4e6;
      --chat-ticket-toggle-color: #be123c;
      --chat-ticket-toggle-border: #fb7185;
      --chat-ticket-panel-bg: #fff;
      --chat-ticket-panel-border: #fecdd3;
      --chat-footer-bg: #fff;
      --chat-footer-border: #fecdd3;
      --chat-footer-shadow: 0 -8px 22px rgba(225,29,72,0.08);
      --chat-input-bg: #fff;
      --chat-input-border: #fecdd3;
      --chat-input-color: #881337;
      --chat-input-focus-border: #f43f5e;
      --chat-input-focus-shadow: 0 0 0 3px rgba(244,63,94,0.16);
      --chat-btn-primary-bg: linear-gradient(135deg, #f43f5e, #e11d48);
      --chat-btn-primary-color: #fff;
      --chat-btn-primary-shadow: 0 10px 22px rgba(225,29,72,0.25);
      --chat-btn-attach-bg: #ffe4e6;
      --chat-btn-attach-color: #be123c;
      --chat-btn-attach-border: #fecdd3;
      --chat-team-badge-bg: linear-gradient(135deg, #e11d48, #fb7185);
      --chat-team-badge-color: #fff;
      --chat-banner-wrap-bg: rgba(255,255,255,0.55);
      --chat-banner-wrap-border: #fecdd3;
      --chat-pending-bg: #ffe4e6;
      --chat-pending-border: #fecdd3;
    }
    body[data-chat-theme="forest"] {
      --chat-page-bg: #f0fdf4;
      --chat-page-color: #14532d;
      --chat-header-bg: linear-gradient(135deg, #dcfce7 0%, #bbf7d0 50%, #86efac 100%);
      --chat-header-border: #4ade80;
      --chat-header-shadow: 0 10px 26px rgba(22,163,74,0.12);
      --chat-name-color: #166534;
      --chat-desc-color: #15803d;
      --chat-avatar-bg: linear-gradient(135deg, #22c55e, #15803d);
      --chat-box-bg: #ffffff;
      --chat-body-bg: linear-gradient(180deg, #f0fdf4 0%, #ecfdf5 40%, #f8fafc 100%);
      --chat-user-bg: linear-gradient(135deg, #22c55e, #16a34a);
      --chat-user-color: #fff;
      --chat-user-meta: rgba(255,255,255,0.86);
      --chat-bot-bg: rgba(255,255,255,0.96);
      --chat-bot-color: #166534;
      --chat-bot-border: #bbf7d0;
      --chat-bot-meta: #15803d;
      --chat-welcome-bg: linear-gradient(135deg, rgba(255,255,255,0.98), rgba(220,252,231,0.98));
      --chat-welcome-border: #4ade80;
      --chat-welcome-meta: #166534;
      --chat-welcome-text: #14532d;
      --chat-security-bg: #fffbeb;
      --chat-security-color: #92400e;
      --chat-security-border: #fde68a;
      --chat-intake-bg: #f0fdf4;
      --chat-intake-border: #bbf7d0;
      --chat-intake-hint: #166534;
      --chat-chip-bg: #fff;
      --chat-chip-border: #bbf7d0;
      --chat-chip-color: #166534;
      --chat-chip-active-bg: #dcfce7;
      --chat-chip-active-border: #22c55e;
      --chat-chip-active-color: #14532d;
      --chat-ticket-toggle-bg: #dcfce7;
      --chat-ticket-toggle-color: #166534;
      --chat-ticket-toggle-border: #4ade80;
      --chat-ticket-panel-bg: #fff;
      --chat-ticket-panel-border: #bbf7d0;
      --chat-footer-bg: #fff;
      --chat-footer-border: #dcfce7;
      --chat-footer-shadow: 0 -8px 22px rgba(22,163,74,0.08);
      --chat-input-bg: #f0fdf4;
      --chat-input-border: #bbf7d0;
      --chat-input-color: #14532d;
      --chat-input-focus-border: #22c55e;
      --chat-input-focus-shadow: 0 0 0 3px rgba(34,197,94,0.16);
      --chat-btn-primary-bg: linear-gradient(135deg, #22c55e, #15803d);
      --chat-btn-primary-color: #fff;
      --chat-btn-primary-shadow: 0 10px 22px rgba(22,163,74,0.22);
      --chat-btn-attach-bg: #dcfce7;
      --chat-btn-attach-color: #166534;
      --chat-btn-attach-border: #bbf7d0;
      --chat-team-badge-bg: linear-gradient(135deg, #16a34a, #4ade80);
      --chat-team-badge-color: #fff;
      --chat-banner-wrap-bg: rgba(255,255,255,0.55);
      --chat-banner-wrap-border: #bbf7d0;
      --chat-pending-bg: #dcfce7;
      --chat-pending-border: #bbf7d0;
    }
    body[data-chat-theme="slate"] {
      --chat-page-bg: #f8fafc;
      --chat-page-color: #0f172a;
      --chat-header-bg: linear-gradient(135deg, #e2e8f0 0%, #cbd5e1 50%, #94a3b8 100%);
      --chat-header-border: #94a3b8;
      --chat-header-shadow: 0 10px 26px rgba(15,23,42,0.1);
      --chat-name-color: #1e293b;
      --chat-desc-color: #475569;
      --chat-avatar-bg: linear-gradient(135deg, #64748b, #334155);
      --chat-box-bg: #ffffff;
      --chat-body-bg: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 40%, #ffffff 100%);
      --chat-user-bg: linear-gradient(135deg, #475569, #334155);
      --chat-user-color: #fff;
      --chat-user-meta: rgba(255,255,255,0.86);
      --chat-bot-bg: rgba(255,255,255,0.96);
      --chat-bot-color: #334155;
      --chat-bot-border: #cbd5e1;
      --chat-bot-meta: #64748b;
      --chat-welcome-bg: linear-gradient(135deg, rgba(255,255,255,0.98), rgba(241,245,249,0.98));
      --chat-welcome-border: #94a3b8;
      --chat-welcome-meta: #475569;
      --chat-welcome-text: #1e293b;
      --chat-security-bg: #fffbeb;
      --chat-security-color: #92400e;
      --chat-security-border: #fde68a;
      --chat-intake-bg: #f8fafc;
      --chat-intake-border: #e2e8f0;
      --chat-intake-hint: #475569;
      --chat-chip-bg: #fff;
      --chat-chip-border: #cbd5e1;
      --chat-chip-color: #334155;
      --chat-chip-active-bg: #e2e8f0;
      --chat-chip-active-border: #64748b;
      --chat-chip-active-color: #0f172a;
      --chat-ticket-toggle-bg: #e2e8f0;
      --chat-ticket-toggle-color: #334155;
      --chat-ticket-toggle-border: #94a3b8;
      --chat-ticket-panel-bg: #fff;
      --chat-ticket-panel-border: #cbd5e1;
      --chat-footer-bg: #fff;
      --chat-footer-border: #e2e8f0;
      --chat-footer-shadow: 0 -8px 22px rgba(15,23,42,0.06);
      --chat-input-bg: #f8fafc;
      --chat-input-border: #cbd5e1;
      --chat-input-color: #0f172a;
      --chat-input-focus-border: #64748b;
      --chat-input-focus-shadow: 0 0 0 3px rgba(100,116,139,0.18);
      --chat-btn-primary-bg: linear-gradient(135deg, #475569, #334155);
      --chat-btn-primary-color: #fff;
      --chat-btn-primary-shadow: 0 10px 22px rgba(51,65,85,0.22);
      --chat-btn-attach-bg: #e2e8f0;
      --chat-btn-attach-color: #334155;
      --chat-btn-attach-border: #cbd5e1;
      --chat-team-badge-bg: linear-gradient(135deg, #64748b, #0f172a);
      --chat-team-badge-color: #fff;
      --chat-banner-wrap-bg: rgba(255,255,255,0.55);
      --chat-banner-wrap-border: #cbd5e1;
      --chat-pending-bg: #e2e8f0;
      --chat-pending-border: #cbd5e1;
    }
    body[data-chat-theme="violet"] {
      --chat-page-bg: #faf5ff;
      --chat-page-color: #4c1d95;
      --chat-header-bg: linear-gradient(135deg, #f3e8ff 0%, #e9d5ff 50%, #d8b4fe 100%);
      --chat-header-border: #c084fc;
      --chat-header-shadow: 0 10px 26px rgba(124,58,237,0.12);
      --chat-name-color: #6d28d9;
      --chat-desc-color: #7c3aed;
      --chat-avatar-bg: linear-gradient(135deg, #8b5cf6, #6d28d9);
      --chat-box-bg: #ffffff;
      --chat-body-bg: linear-gradient(180deg, #faf5ff 0%, #f5f3ff 40%, #f8fafc 100%);
      --chat-user-bg: linear-gradient(135deg, #8b5cf6, #7c3aed);
      --chat-user-color: #fff;
      --chat-user-meta: rgba(255,255,255,0.88);
      --chat-bot-bg: rgba(255,255,255,0.96);
      --chat-bot-color: #5b21b6;
      --chat-bot-border: #e9d5ff;
      --chat-bot-meta: #7c3aed;
      --chat-welcome-bg: linear-gradient(135deg, rgba(255,255,255,0.98), rgba(243,232,255,0.98));
      --chat-welcome-border: #c084fc;
      --chat-welcome-meta: #6d28d9;
      --chat-welcome-text: #4c1d95;
      --chat-security-bg: #fffbeb;
      --chat-security-color: #92400e;
      --chat-security-border: #fde68a;
      --chat-intake-bg: #faf5ff;
      --chat-intake-border: #e9d5ff;
      --chat-intake-hint: #6d28d9;
      --chat-chip-bg: #fff;
      --chat-chip-border: #e9d5ff;
      --chat-chip-color: #5b21b6;
      --chat-chip-active-bg: #f3e8ff;
      --chat-chip-active-border: #8b5cf6;
      --chat-chip-active-color: #6d28d9;
      --chat-ticket-toggle-bg: #f3e8ff;
      --chat-ticket-toggle-color: #6d28d9;
      --chat-ticket-toggle-border: #c084fc;
      --chat-ticket-panel-bg: #fff;
      --chat-ticket-panel-border: #e9d5ff;
      --chat-footer-bg: #fff;
      --chat-footer-border: #f3e8ff;
      --chat-footer-shadow: 0 -8px 22px rgba(124,58,237,0.08);
      --chat-input-bg: #faf5ff;
      --chat-input-border: #e9d5ff;
      --chat-input-color: #4c1d95;
      --chat-input-focus-border: #8b5cf6;
      --chat-input-focus-shadow: 0 0 0 3px rgba(139,92,246,0.18);
      --chat-btn-primary-bg: linear-gradient(135deg, #8b5cf6, #6d28d9);
      --chat-btn-primary-color: #fff;
      --chat-btn-primary-shadow: 0 10px 22px rgba(124,58,237,0.25);
      --chat-btn-attach-bg: #f3e8ff;
      --chat-btn-attach-color: #6d28d9;
      --chat-btn-attach-border: #e9d5ff;
      --chat-team-badge-bg: linear-gradient(135deg, #7c3aed, #c084fc);
      --chat-team-badge-color: #fff;
      --chat-banner-wrap-bg: rgba(255,255,255,0.55);
      --chat-banner-wrap-border: #e9d5ff;
      --chat-pending-bg: #f3e8ff;
      --chat-pending-border: #e9d5ff;
    }
    /* 强制单列：左侧介绍栏一律不显示（兼容旧版 HTML） */
    .chat-hero { display: none !important; }
    /* 旧版/缓存脚本插入的顶栏：禁止再参与「侧栏」布局（曾导致整段字竖排在左侧） */
    #agent-notice { display: none !important; }
    html {
      height: 100%;
      -webkit-text-size-adjust: 100%;
      text-size-adjust: 100%;
    }
    body {
      margin: 0;
      font-family: "PingFang SC","Microsoft YaHei",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
      line-height: 1.5;
      min-height: 100%;
      min-height: 100vh;
      min-height: 100dvh;
      background: var(--chat-page-bg, #f5f7fb);
      color: var(--chat-page-color, #0f172a);
      /* 必须为纵向：否则 insertAdjacentHTML(afterbegin) 插入的提示条会与 .chat-shell 横向并排，H5 上形成左侧「死窄条」 */
      display: flex;
      flex-direction: column;
      align-items: stretch;
      padding: 0;
      padding-left: env(safe-area-inset-left, 0px);
      padding-right: env(safe-area-inset-right, 0px);
      overflow-x: hidden;
      overscroll-behavior-x: none;
      background-size: cover;
      background-position: center center;
      background-repeat: no-repeat;
    }
    /* 插在 body 最前的提示条（api-warn、本地文件提示等）：占满宽，勿与主栏并排 */
    body > :not(.chat-shell):not(.media-lightbox) {
      width: 100%;
      max-width: 100%;
      flex: 0 0 auto;
      align-self: stretch;
      box-sizing: border-box;
    }
    .chat-shell {
      max-width: 1040px;
      width: 100%;
      margin-left: auto;
      margin-right: auto;
      display: flex;
      flex-direction: column;
      align-items: stretch;
      padding: 0;
      box-sizing: border-box;
      flex: 1;
      min-height: 0;
    }
    .chat-header {
      padding: 18px 20px;
      padding-top: max(18px, env(safe-area-inset-top, 0px));
      background: var(--chat-header-bg);
      border-bottom: 1px solid var(--chat-header-border);
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      row-gap: 12px;
      gap: 14px;
      box-shadow: var(--chat-header-shadow);
      flex-shrink: 0;
      min-width: 0;
    }
    .chat-header.has-banners {
      align-items: flex-end;
      padding-bottom: 20px;
    }
    .chat-title {
      flex: 0 1 auto;
      min-width: 0;
      display: flex;
      align-items: center;
    }
    .chat-title .name {
      line-height: 1.25;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      max-width: 12rem;
    }
    .chat-avatar {
      width: 44px; height: 44px;
      flex-shrink: 0;
      border-radius: 50%;
      background: var(--chat-avatar-bg);
      object-fit: cover;
    }
    .chat-title .name { font-size: 19px; font-weight: 700; color: var(--chat-name-color); letter-spacing: .2px; }
    .chat-banner-pc-grid {
      flex-shrink: 0;
      margin-left: auto;
      display: none;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 12px;
      width: min(900px, 78vw);
      min-width: 280px;
      align-self: center;
      --chat-banner-pc-height: 100px;
    }
    .chat-banner-pc-grid[data-slot-count="1"] {
      width: min(460px, 46vw);
      min-width: 260px;
      --chat-banner-pc-height: 140px;
    }
    .chat-banner-pc-grid[data-slot-count="2"] {
      width: min(760px, 74vw);
      min-width: 360px;
      --chat-banner-pc-height: 120px;
    }
    .chat-banner-pc-grid[data-slot-count="3"] {
      width: min(900px, 78vw);
      --chat-banner-pc-height: 100px;
    }
    .chat-banner-wrap {
      display: none;
      align-items: center;
      justify-content: center;
      border-radius: 12px;
      overflow: hidden;
      box-shadow: 0 4px 12px rgba(15,23,42,0.12);
      -webkit-tap-highlight-color: transparent;
      background: var(--chat-banner-wrap-bg);
      border: 1px solid var(--chat-banner-wrap-border);
    }
    .chat-banner-wrap.is-clickable { cursor: pointer; }
    .chat-banner-wrap:not(.is-clickable) { cursor: default; }
    .chat-banner-pc-grid .chat-banner-wrap {
      width: 100%;
      height: var(--chat-banner-pc-height, 100px);
      min-height: 88px;
    }
    .chat-banner-mobile {
      flex-shrink: 0;
      margin-left: auto;
      width: min(300px, 58vw);
      height: 110px;
      min-height: 96px;
    }
    .chat-banner-wrap img {
      width: 100%;
      height: 100%;
      object-fit: contain;
      object-position: center;
      vertical-align: middle;
      display: block;
      image-rendering: auto;
      -webkit-backface-visibility: hidden;
      backface-visibility: hidden;
    }
    .chat-box {
      background: var(--chat-box-bg);
      border-radius: 0;
      box-shadow: none;
      display: flex;
      flex-direction: column;
      overflow: hidden;
      flex: 1;
      min-height: 0;
      width: 100%;
      min-width: 0;
    }
    .chat-body {
      flex: 1;
      min-height: 0;
      overflow-x: hidden;
      overflow-y: auto;
      overscroll-behavior: contain;
      -webkit-overflow-scrolling: touch;
      width: 100%;
      background: var(--chat-body-bg);
    }
    .chat-msgs-flow {
      min-height: 100%;
      display: flex;
      flex-direction: column;
      gap: 16px;
      padding: 24px 28px;
      box-sizing: border-box;
    }
    .chat-spacer {
      flex: 1 1 auto;
      min-height: 0;
      width: 100%;
      pointer-events: none;
    }
    .chat-scroll-anchor {
      height: 1px;
      width: 100%;
      flex-shrink: 0;
      pointer-events: none;
    }
    .rating-invite-card { margin-top: 8px; padding: 12px; border-radius: 10px; background: rgba(255,255,255,.95); border: 1px solid #dbeafe; color: #1e293b; max-width: 320px; }
    .rating-invite-card .rating-title { font-size: 14px; font-weight: 600; margin-bottom: 8px; }
    .rating-invite-card .rating-stars { display: flex; gap: 6px; margin-bottom: 8px; }
    .rating-invite-card .rating-star { border: none; background: transparent; font-size: 24px; line-height: 1; cursor: pointer; color: #cbd5e1; padding: 0; }
    .rating-invite-card .rating-star.active, .rating-invite-card .rating-star:hover { color: #f59e0b; }
    .rating-invite-card textarea { width: 100%; min-height: 56px; resize: vertical; border: 1px solid #e2e8f0; border-radius: 8px; padding: 8px; font-size: 13px; box-sizing: border-box; }
    .rating-invite-card .rating-submit { margin-top: 8px; border: none; border-radius: 8px; background: #2563eb; color: #fff; padding: 8px 14px; cursor: pointer; font-size: 13px; }
    .rating-invite-card .rating-thanks { font-size: 14px; color: #047857; white-space: pre-wrap; }
    .chat-msg {
      max-width: min(78%, 42rem);
      padding: 14px 18px;
      border-radius: 16px;
      font-size: 15px;
      line-height: 1.62;
      box-shadow: 0 10px 24px rgba(15,23,42,0.08);
      display: flex;
      flex-direction: column;
      gap: 8px;
    }
    .chat-msg .msg-meta {
      font-size: 12px;
      opacity: 1;
      line-height: 1.3;
      font-weight: 600;
      letter-spacing: .2px;
    }
    .chat-msg .msg-text {
      white-space: pre-wrap;
      word-break: break-word;
    }
    /* desk-msg-quote-style-b-v1 */
    .chat-msg .msg-quote-soft {
      margin: 0 0 8px;
      padding: 7px 9px;
      border-radius: 8px;
      background: rgba(255,255,255,0.85);
      border: 1px solid rgba(148, 163, 184, 0.35);
    }
    .chat-msg .msg-quote-soft .msg-quote-hd {
      font-size: 11px; font-weight: 700; color: #64748b; margin-bottom: 2px;
    }
    .chat-msg .msg-quote-soft .msg-quote-bd {
      font-size: 12px; color: #94a3b8; line-height: 1.45;
      white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    }
    .chat-msg .msg-quote-reply { white-space: pre-wrap; word-break: break-word; }
    .chat-msg img { cursor: zoom-in; }
    .media-lightbox {
      position: fixed; inset: 0; background: rgba(15,23,42,.8); z-index: 9999;
      display: none; align-items: center; justify-content: center; padding: 20px;
    }
    .media-lightbox.show { display: flex; }
    .media-lightbox img {
      max-width: min(92vw, 1200px); max-height: 92vh; border-radius: 10px; box-shadow: 0 10px 30px rgba(0,0,0,.35);
    }
    .chat-msg.user {
      align-self: flex-end;
      background: var(--chat-user-bg);
      color: var(--chat-user-color);
      border-bottom-right-radius: 6px;
    }
    .chat-msg.bot {
      align-self: flex-start;
      background: var(--chat-bot-bg);
      color: var(--chat-bot-color);
      border: 1px solid var(--chat-bot-border);
      border-bottom-left-radius: 6px;
    }
    .chat-msg.user .msg-meta { color: var(--chat-user-meta); }
    .chat-msg.bot .msg-meta { color: var(--chat-bot-meta); }
    .chat-msg.welcome-card {
      max-width: min(92%, 48rem);
      align-self: flex-start;
      background: var(--chat-welcome-bg);
      border: 1px solid var(--chat-welcome-border);
      box-shadow: 0 14px 30px rgba(37, 99, 235, 0.10);
    }
    .chat-msg.welcome-card .msg-meta { color: var(--chat-welcome-meta); }
    .chat-msg.welcome-card .msg-text { color: var(--chat-welcome-text); }
    .chat-msg.welcome-card .msg-text.rich { white-space: normal; }
    .chat-msg.welcome-card .msg-text a {
      color: #2563eb;
      text-decoration: underline;
      word-break: break-all;
      cursor: pointer;
    }
    .chat-msg.pending-media {
      opacity: .85;
      border-style: dashed;
      border-color: #93c5fd;
    }
    /* security-marquee-smooth-v2: 按单段像素位移 + 填满视口，避免右侧突然冒出 */
    .security-strip {
      flex-shrink: 0;
      padding: 0;
      font-size: 12px;
      line-height: 1.45;
      color: var(--chat-security-color);
      background: var(--chat-security-bg);
      border-bottom: 1px solid var(--chat-security-border);
      overflow: hidden;
    }
    .security-strip-viewport {
      overflow: hidden;
      width: 100%;
      padding: 10px 0;
    }
    .security-strip-track {
      display: inline-flex;
      align-items: center;
      width: max-content;
      white-space: nowrap;
      will-change: transform;
      backface-visibility: hidden;
      transform: translate3d(0, 0, 0);
      animation: securityMarqueeRtl linear infinite;
      animation-duration: 12s;
    }
    .security-strip-track .security-strip-item {
      display: inline-block;
      padding-left: 16px;
      margin-right: 64px;
      flex-shrink: 0;
    }
    @keyframes securityMarqueeRtl {
      from { transform: translate3d(0, 0, 0); }
      to { transform: translate3d(calc(-1 * var(--marquee-shift, 50%)), 0, 0); }
    }
    @media (prefers-reduced-motion: reduce) {
      .security-strip-track { animation: none !important; transform: none !important; }
      .security-strip-viewport { overflow-x: auto; }
    }
    .intake-wrap {
      flex-shrink: 0;
      padding: 12px 16px 14px;
      background: var(--chat-intake-bg);
      border-top: 1px solid var(--chat-intake-border);
    }
    .intake-wrap .intake-hint { font-size: 13px; color: var(--chat-intake-hint); margin-bottom: 10px; line-height: 1.5; }
    .intake-chips { display: flex; flex-wrap: wrap; gap: 8px; }
    .intake-chip {
      padding: 8px 12px;
      border-radius: 999px;
      border: 1px solid var(--chat-chip-border);
      background: var(--chat-chip-bg);
      font-size: 13px;
      color: var(--chat-chip-color);
      cursor: pointer;
      -webkit-tap-highlight-color: transparent;
      box-shadow: 0 2px 6px rgba(15,23,42,0.04);
    }
    .intake-chip.active { border-color: var(--chat-chip-active-border); background: var(--chat-chip-active-bg); color: var(--chat-chip-active-color); font-weight: 600; }
    .chat-footer {
      padding: 14px 16px;
      padding-bottom: max(14px, env(safe-area-inset-bottom, 0px));
      border-top: 1px solid var(--chat-footer-border);
      width: 100%;
      display: flex;
      align-items: center;
      gap: 12px;
      background: var(--chat-footer-bg);
      flex-shrink: 0;
      min-width: 0;
      box-shadow: var(--chat-footer-shadow);
    }
    .chat-footer input[type="text"] {
      flex: 1;
      min-width: 0;
      padding: 12px 14px;
      border: 1px solid var(--chat-input-border);
      border-radius: 12px;
      background: var(--chat-input-bg);
      color: var(--chat-input-color);
      font-size: 16px;
      outline: none;
      box-shadow: inset 0 1px 2px rgba(15,23,42,0.03);
    }
    .chat-footer input:focus { border-color: var(--chat-input-focus-border); background: var(--chat-input-bg); box-shadow: var(--chat-input-focus-shadow); }
    .chat-footer input::placeholder { color: var(--chat-desc-color); opacity: 0.75; }
    .chat-footer button {
      padding: 12px 18px;
      min-height: 44px;
      flex-shrink: 0;
      background: var(--chat-btn-primary-bg);
      color: var(--chat-btn-primary-color);
      border: none;
      border-radius: 12px;
      font-size: 15px;
      cursor: pointer;
      white-space: nowrap;
      font-weight: 700;
      box-shadow: var(--chat-btn-primary-shadow);
    }
    .chat-footer button:hover { opacity: .95; }
    .chat-footer button:disabled { opacity: .6; cursor: not-allowed; }
    .chat-footer .btn-attach {
      background: var(--chat-btn-attach-bg);
      color: var(--chat-btn-attach-color);
      border: 1px solid var(--chat-btn-attach-border);
      box-shadow: none;
      font-weight: 600;
    }
    .chat-footer .btn-emoji {
      background: var(--chat-btn-attach-bg);
      color: var(--chat-btn-attach-color);
      border: 1px solid var(--chat-btn-attach-border);
      box-shadow: none;
      font-weight: 600;
      min-width: 44px;
      padding-left: 12px;
      padding-right: 12px;
    }
    .pending-attach-preview {
      flex-shrink: 0;
      display: none;
      padding: 10px 14px;
      background: var(--chat-pending-bg);
      border-top: 1px solid var(--chat-pending-border);
      align-items: center;
      gap: 10px;
      flex-wrap: wrap;
    }
    .pending-attach-preview .pending-inner { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; width: 100%; }
    .pending-attach-preview .pending-label { font-size: 12px; color: #64748b; }
    .pending-attach-preview img { max-width: 120px; max-height: 90px; border-radius: 8px; object-fit: cover; border: 1px solid #cbd5e1; }
    .pending-attach-preview video { max-width: 160px; max-height: 100px; border-radius: 8px; border: 1px solid #cbd5e1; }
    .pending-attach-preview .btn-clear-pending {
      padding: 6px 12px; font-size: 12px; border-radius: 8px; border: 1px solid #94a3b8; background: #fff; color: #475569; cursor: pointer;
    }

    /* ------- 桌面端：固定视口高度，消息区内部滚动（避免整页滚动导致滚到顶部） ------- */
    @media (min-width: 769px) {
      html, body {
        height: 100%;
        overflow: hidden;
      }
      .chat-shell {
        height: 100%;
        max-height: 100dvh;
      }
      .chat-box {
        height: 100%;
        max-height: 100dvh;
      }
    }

    /* ------- 移动端：单列全屏，无侧栏，铺满视口 ------- */
    @media (max-width: 768px) {
      html, body {
        padding: 0;
        margin: 0;
        width: 100%;
        min-width: 100%;
        max-width: 100%;
        background: var(--chat-page-bg, #f1f5f9);
        overflow-x: hidden;
        height: 100%;
        min-height: 100vh;
        min-height: 100dvh;
      }
      .chat-shell {
        padding: 0;
        max-width: 100%;
        width: 100%;
        min-width: 100%;
        flex: 1;
        min-height: 0;
      }
      .chat-box {
        width: 100%;
        min-width: 100%;
        flex: 1;
        min-height: 0;
        height: auto;
        max-height: none;
        min-height: -webkit-fill-available;
        border-radius: 0;
      }
      .chat-header {
        border-radius: 0;
        flex-shrink: 0;
        padding: 12px 12px;
        padding-top: max(12px, env(safe-area-inset-top, 0px));
        flex-wrap: nowrap;
        align-items: center;
        column-gap: 10px;
      }
      .chat-avatar {
        width: 40px;
        height: 40px;
      }
      .chat-title {
        flex: 0 1 auto;
        max-width: 32vw;
      }
      .chat-title .name {
        font-size: 17px;
        max-width: 100%;
      }
      .chat-banner-pc-grid { display: none !important; }
      .chat-banner-mobile {
        flex: 1 1 auto;
        margin-left: auto;
        width: auto;
        max-width: min(220px, 58vw);
        min-width: 110px;
        height: 96px;
        min-height: 88px;
      }
      .chat-header.has-banners { align-items: center; padding-bottom: 12px; }
      .chat-body {
        padding: 16px max(12px, env(safe-area-inset-left, 0px)) 16px max(12px, env(safe-area-inset-right, 0px));
        flex: 1;
        min-height: 0;
      }
      .chat-msg {
        max-width: min(90%, calc(100% - 8px));
        font-size: 15px;
        padding: 12px 14px;
        word-break: break-word;
      }
      .chat-footer {
        padding: 10px max(10px, env(safe-area-inset-left, 0px)) max(10px, env(safe-area-inset-bottom, 0px)) max(10px, env(safe-area-inset-right, 0px));
        gap: 8px;
        flex-shrink: 0;
      }
      .chat-footer input[type="text"] {
        font-size: 16px;
      }
      .chat-footer button {
        padding: 10px 14px;
        min-width: 64px;
      }
      #btnAttach, #btnEmoji {
        padding: 8px 12px !important;
        min-width: 44px;
        min-height: 44px;
      }
      .intake-wrap { padding: 10px 10px 12px; }
      .intake-chip { font-size: 12px; padding: 8px 10px; }
    }

    .rating-invite-modal { display: none; position: fixed; inset: 0; z-index: 10050; align-items: center; justify-content: center; padding: 16px; }
    .rating-invite-modal.show { display: flex; }
    .rating-invite-modal-backdrop { position: absolute; inset: 0; background: rgba(15, 23, 42, 0.55); }
    .rating-invite-modal-panel { position: relative; z-index: 1; width: min(100%, 360px); background: #fff; border-radius: 14px; box-shadow: 0 18px 48px rgba(15,23,42,.28); padding: 18px 18px 16px; animation: ratingModalIn .22s ease-out; }
    @keyframes ratingModalIn { from { opacity: 0; transform: translateY(12px) scale(.98); } to { opacity: 1; transform: none; } }
    .rating-invite-modal .rating-title { font-size: 16px; font-weight: 700; margin-bottom: 8px; color: #0f172a; text-align: center; }
    .rating-invite-modal .rating-hint { font-size: 13px; color: #64748b; margin-bottom: 10px; text-align: center; }
    .rating-invite-modal .rating-stars { display: flex; gap: 8px; justify-content: center; margin-bottom: 12px; }
    .rating-invite-modal .rating-star { border: none; background: transparent; font-size: 30px; line-height: 1; cursor: pointer; color: #cbd5e1; padding: 0; }
    .rating-invite-modal .rating-star.active, .rating-invite-modal .rating-star:hover { color: #f59e0b; }
    .rating-invite-modal textarea { width: 100%; min-height: 72px; resize: vertical; border: 1px solid #e2e8f0; border-radius: 10px; padding: 10px; font-size: 14px; box-sizing: border-box; }
    .rating-invite-modal .rating-submit { display: block; width: 100%; margin-top: 12px; border: none; border-radius: 10px; background: #2563eb; color: #fff; padding: 11px 14px; cursor: pointer; font-size: 15px; font-weight: 600; }
    .rating-invite-modal .rating-thanks { font-size: 16px; color: #047857; text-align: center; padding: 12px 0; white-space: pre-wrap; }
// rating-popup-v1
  
