        .cb-root { position: fixed; right: 18px; bottom: 18px; z-index: 9999; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; transition: bottom .2s ease; }
        /* Cookie lišta (cookie-consent.js) je vlevo dole, chatbot vpravo — takže se
           na rozdíl od dřívějška vůbec nepřekrývají a není potřeba nic koordinovat. */
        /* Dokud je vidět mobilní sticky CTA lišta (subjekt/index.php .sticky-mobile-cta,
           <600px), posuň se nad ni — projektově specifická vazba, viz JS níže. */
        html.mobile-cta-open .cb-root { bottom: calc(var(--mobile-cta-h, 64px) + 10px); }
        html.mobile-cta-open .cb-panel { bottom: calc(var(--mobile-cta-h, 64px) + 76px); }
        .cb-toggle {
            position: relative;
            width: 58px; height: 58px; border-radius: 50%; border: none; cursor: pointer;
            background: linear-gradient(135deg, var(--cb-accent) 0%, var(--cb-accent-dark) 100%);
            color: #fff; box-shadow: 0 4px 16px rgba(0,0,0,.22);
            display: flex; align-items: center; justify-content: center;
            transition: transform .15s ease;
        }
        .cb-toggle:hover { transform: scale(1.06); }
        .cb-toggle svg { width: 26px; height: 26px; }
        .cb-toggle .cb-icon-close { display: none; }
        .cb-root.is-open .cb-toggle .cb-icon-chat { display: none; }
        .cb-root.is-open .cb-toggle .cb-icon-close { display: block; }

        .cb-badge {
            position: absolute; top: -3px; right: -3px;
            min-width: 20px; height: 20px; padding: 0 4px; border-radius: 999px;
            background: #ef4444; color: #fff; font-size: .68rem; font-weight: 800;
            display: flex; align-items: center; justify-content: center;
            box-shadow: 0 0 0 2px #fff; animation: cbBadgePop .3s ease;
        }
        @keyframes cbBadgePop { from { transform: scale(0); } to { transform: scale(1); } }
        .cb-root.is-open .cb-badge, .cb-badge[hidden] { display: none; }

        /* Proaktivní "engagement" bublina (jen /subjekt, viz PHP výše) — kompaktní
           kartička nad ikonkou chatu, ne celý panel, ať nezasahuje do zbytku UI. */
        .cb-engage {
            position: absolute; bottom: calc(100% + 14px); right: 0;
            width: 250px; max-width: calc(100vw - 36px);
            background: #fff; border-radius: 16px;
            box-shadow: 0 12px 32px rgba(0,0,0,.18);
            padding: .9rem 1rem .85rem;
            opacity: 0; transform: translateY(8px) scale(.97); pointer-events: none;
            transition: opacity .2s ease, transform .2s ease;
        }
        .cb-engage.is-visible { opacity: 1; transform: translateY(0) scale(1); pointer-events: auto; }
        .cb-root.is-open .cb-engage { display: none; } /* nemá smysl svítit nad otevřeným panelem */
        .cb-engage-close {
            position: absolute; top: .5rem; right: .5rem;
            width: 22px; height: 22px; border-radius: 50%; border: none; background: none;
            color: #94a3b8; font-size: 1.05rem; line-height: 1; cursor: pointer;
        }
        .cb-engage-close:hover { background: #f1f5f9; color: #475569; }
        .cb-engage-question { font-size: .86rem; font-weight: 700; color: #0f172a; line-height: 1.4; padding-right: 1.1rem; }
        .cb-engage-actions { display: flex; gap: .5rem; margin-top: .7rem; }
        .cb-engage-btn {
            flex: 1; border: none; border-radius: 9px; padding: .45rem .5rem;
            background: #eef2ff; color: #2848c7; font-weight: 700; font-size: .82rem;
            cursor: pointer; font-family: inherit; transition: background .12s ease;
        }
        .cb-engage-btn:hover { background: #e0e7ff; }
        /* Malý "ocásek" bubliny směrem k ikonce chatu, ať je jasné, odkud přišla */
        .cb-engage::after {
            content: ''; position: absolute; bottom: -7px; right: 22px;
            width: 14px; height: 14px; background: #fff;
            transform: rotate(45deg); box-shadow: 3px 3px 6px rgba(0,0,0,.05);
        }

        .cb-panel {
            /* Ukotvený přímo k viewportu přes top+bottom (ne přes výšku počítanou z vh/dvh
               a ne relativně k malému 58px boxu .cb-root) — výška se tak vždy odvodí ze
               skutečně dostupného prostoru mezi horním okrajem obrazovky a tlačítkem/CTA
               lištou dole, na jakékoli šířce i výšce obrazovky, bez zvláštních výjimek.
               Dřívější přístup (position:absolute + počítaná height) se přesně v tomhle
               na některých šířkách rozcházel a ořezával horní část panelu (hlavičku). */
            position: fixed; right: 18px;
            width: 360px; max-width: calc(100vw - 24px);
            top: 16px; bottom: 84px; /* 84 = 18 (odsazení .cb-root) + 58 (tlačítko) + 8 (mezera) */
            background: #fff; border-radius: 16px;
            box-shadow: 0 12px 40px rgba(0,0,0,.22);
            display: flex; flex-direction: column; overflow: hidden;
            opacity: 0; transform: translateY(12px) scale(.98); pointer-events: none;
            transition: opacity .18s ease, transform .18s ease, bottom .2s ease;
        }
        .cb-root.is-open .cb-panel { opacity: 1; transform: translateY(0) scale(1); pointer-events: auto; }

        .cb-header {
            background: #fff; border-bottom: 1px solid #eef1f5;
            color: #0f172a; padding: .85rem 1.1rem; display: flex; align-items: center; justify-content: space-between; flex-shrink: 0;
        }
        .cb-header-info strong { display: block; font-size: 1rem; font-weight: 800; }
        .cb-close { background: none; border: none; color: #94a3b8; width: 26px; height: 26px; border-radius: 50%; cursor: pointer; font-size: 1.3rem; line-height: 1; flex-shrink: 0; }
        .cb-close:hover { background: #f1f5f9; color: #475569; }

        /* Drobečková navigace — ukazuje, kde v konverzaci jsi, a nahrazuje "◀ Zpět" tlačítka
           zahrabaná v seznamu rychlých odpovědí jedním trvale viditelným řádkem. */
        .cb-breadcrumb { display: flex; align-items: center; gap: .35rem; padding: .5rem 1.1rem; border-top: 1px solid #eef1f5; background: #fafbfc; font-size: .74rem; flex-shrink: 0; }
        .cb-crumb { background: none; border: none; padding: 0; color: var(--cb-accent-dark); font-weight: 700; font-size: .74rem; cursor: pointer; font-family: inherit; }
        .cb-crumb:hover { text-decoration: underline; }
        .cb-crumb-sep { color: #cbd5e1; }

        .cb-messages { flex: 1; overflow-y: auto; padding: .3rem 1.1rem 1rem; display: flex; flex-direction: column; gap: .6rem; background: #fff; }
        .cb-msg { max-width: 88%; padding: .55rem .75rem; border-radius: 12px; font-size: .84rem; line-height: 1.5; }
        .cb-msg-bot { align-self: flex-start; background: #f1f5f9; color: #1a2533; border-bottom-left-radius: 4px; }
        .cb-msg-user { align-self: flex-end; background: var(--cb-accent); color: #fff; border-bottom-right-radius: 4px; }
        .cb-msg a, .cb-msg-link-btn { color: inherit; font-weight: 700; text-decoration: underline; }
        .cb-msg-links { margin-top: .4rem; display: flex; flex-direction: column; gap: .25rem; }
        /* Odkaz typu "action" (viz config.php `links`) — otevře modal/formulář na stránce
           místo navigace na URL. Vzhledově stejné jako běžný odkaz, jen <button>. */
        .cb-msg-link-btn { background: none; border: none; padding: 0; margin: 0; cursor: pointer; font-size: inherit; font-family: inherit; text-align: left; }
        .cb-msg-link-btn:hover { text-decoration: none; }
        /* Uvítací zpráva bota — bez bubliny, výrazněji jako nadpis (viz vzor v zadání) */
        .cb-msg-greeting { max-width: 100%; background: none; padding: .1rem 0 .2rem; font-size: .84rem; font-weight: 600; color: #0f172a; line-height: 1.5; }

        /* "Profilovka" odznaku OVĚŘENO u zpráv od nás (bot/greeting) — user zprávy avatar nemají. */
        .cb-msg-row { display: flex; align-items: flex-end; gap: .5rem; max-width: 100%; }
        .cb-msg-row .cb-msg-bot { max-width: calc(100% - 34px); }
        .cb-msg-avatar {
            width: 26px; height: 26px; border-radius: 50%; flex-shrink: 0; align-self: flex-end;
            object-fit: contain; background: #eef6ff; border: 1px solid #dbe4ee; padding: 3px; box-sizing: border-box;
        }

        /* Vevnitř .cb-messages (viz markup) — boční/spodní odsazení dodá rodič svým vlastním
           paddingem, mezeru nad prvním tlačítkem dá flex gap .cb-messages. Bez vlastního
           max-height/overflow: scroluje se společně s celou konverzací jako jeden celek. */
        .cb-quick { display: flex; flex-direction: column; gap: .35rem; flex-shrink: 0; }
        .cb-quick-btn {
            display: flex; align-items: center; justify-content: space-between; gap: .5rem;
            text-align: left; background: #eef2ff; border: none; color: #2848c7;
            border-radius: 9px; padding: .5rem .75rem; font-size: .8rem; font-weight: 600; cursor: pointer;
            transition: background .12s ease;
        }
        .cb-quick-btn:hover { background: #e0e7ff; }
        .cb-quick-btn .cb-quick-chevron { flex-shrink: 0; opacity: .55; }
        .cb-quick-btn.cb-quick-secondary { background: none; color: #64748b; font-weight: 500; padding: .45rem .3rem; }
        .cb-quick-btn.cb-quick-secondary:hover { background: #f8fafc; color: #334155; }
        .cb-quick-btn.cb-quick-secondary .cb-quick-chevron { display: none; }

        .cb-footer { border-top: 1px solid #eef1f5; padding: .6rem .8rem .7rem; flex-shrink: 0; text-align: center; }
        .cb-contact-btn {
            width: 100%; background: none; border: none; color: var(--cb-accent-dark); font-weight: 700; font-size: .82rem;
            cursor: pointer; padding: .3rem;
        }
        .cb-footer-note { display: block; font-size: .72rem; color: #94a3b8; margin-top: .15rem; }
        .cb-contact-btn:hover { text-decoration: underline; }

        .cb-contact-form { padding: .8rem; border-top: 1px solid #eef1f5; display: flex; flex-direction: column; gap: .5rem; flex-shrink: 0; }
        .cb-contact-form input, .cb-contact-form textarea {
            border: 1px solid #dbe4ee; border-radius: 8px; padding: .5rem .6rem; font-size: .82rem; font-family: inherit; resize: vertical;
        }
        .cb-contact-form textarea { min-height: 64px; }
        .cb-honeypot { position: absolute !important; left: -9999px !important; top: -9999px !important; width: 1px; height: 1px; opacity: 0; overflow: hidden; }
        .cb-contact-actions { display: flex; justify-content: space-between; gap: .5rem; }
        .cb-contact-cancel, .cb-contact-send { border: none; border-radius: 8px; padding: .5rem .9rem; font-size: .8rem; font-weight: 700; cursor: pointer; }
        .cb-contact-cancel { background: #eef2f7; color: #475569; }
        .cb-contact-send { background: var(--cb-accent); color: #fff; }
        .cb-contact-send:disabled { opacity: .6; cursor: default; }
        .cb-contact-error { color: #dc2626; font-size: .76rem; }

        @media (max-width: 480px) {
            /* Stejná technika jako v základním pravidle výše (position:fixed top+bottom),
               jen na celou šířku obrazovky. */
            .cb-panel { left: 10px; right: 10px; width: auto; max-width: none; bottom: 78px; }

            /* Ikonka na mobilu jako "výstupek" zapuštěný do pravého okraje obrazovky
               (většina tlačítka je mimo viewport), místo plně viditelného kruhu — méně
               invazivní vzhled. Zavřený stav = jen peeking okraj vpravo; po otevření
               panelu (nebo tapnutím) se celé tlačítko zasune na dohled, ať jde pohodlně
               zavřít křížkem. */
            .cb-root { right: 0; bottom: 14px; }
            .cb-toggle {
                width: 54px; height: 54px;
                border-radius: 27px 0 0 27px;
                justify-content: flex-start;
                padding-left: 11px;
                transform: translateX(24px);
            }
            .cb-toggle:hover { transform: translateX(24px); }
            .cb-toggle svg { width: 22px; height: 22px; }
            .cb-root.is-open .cb-toggle,
            .cb-root.is-open .cb-toggle:hover { transform: translateX(0); }
            .cb-badge { top: -4px; left: 3px; right: auto; }
        }
