.cdchat { position: fixed; right: 20px; bottom: 20px; z-index: 80; font-family: var(--font-body); }
.cdchat__fab { width: 60px; height: 60px; border-radius: 50%; background: var(--color-primary); color: #fff; display: grid; place-items: center; box-shadow: 0 10px 30px oklch(0.6 0.19 36 / .45); position: relative; transform: scale(0); transition: transform .5s cubic-bezier(.34,1.56,.64,1), background .2s; }
.cdchat.is-ready .cdchat__fab { transform: scale(1); }
.cdchat__fab:hover { background: var(--color-primary-h); transform: scale(1.07); }
.cdchat__fab svg { width: 28px; height: 28px; }
.cdchat__fab::before { content: ''; position: absolute; inset: 0; border-radius: 50%; border: 2px solid var(--color-primary); animation: cdpulse 2.4s infinite; }
.cdchat.is-open .cdchat__fab::before { animation: none; opacity: 0; }
@keyframes cdpulse { 0% { transform: scale(1); opacity: .7; } 100% { transform: scale(1.7); opacity: 0; } }
.cdchat__badge { position: absolute; top: -2px; right: -2px; min-width: 20px; height: 20px; border-radius: 10px; background: var(--color-ink); color: #fff; font-size: 12px; font-weight: 700; display: grid; place-items: center; border: 2px solid #fff; }
.cdchat__badge[hidden] { display: none; }
.cdchat__panel { position: absolute; right: 0; bottom: 76px; width: min(380px, calc(100vw - 32px)); height: min(560px, calc(100dvh - 120px)); background: var(--color-surface); border-radius: 20px; box-shadow: 0 24px 60px oklch(0.2 0.04 258 / .28); display: flex; flex-direction: column; overflow: hidden; opacity: 0; transform: translateY(16px) scale(.96); transform-origin: 100% 100%; transition: opacity .3s cubic-bezier(.16,1,.3,1), transform .3s cubic-bezier(.16,1,.3,1); }
.cdchat.is-open .cdchat__panel { opacity: 1; transform: none; }
.cdchat__head { display: flex; align-items: center; gap: .75rem; padding: 1rem 1.1rem; background: var(--color-ink); color: #fff; }
.cdchat__ava svg { width: 38px; height: 38px; display: block; }
.cdchat__head b { display: block; font-size: 15px; }
.cdchat__head small { font-size: 12px; color: oklch(0.82 0.02 255); display: flex; align-items: center; gap: .35rem; }
.cdchat__head i { width: 8px; height: 8px; border-radius: 50%; background: oklch(0.75 0.17 150); box-shadow: 0 0 0 3px oklch(0.75 0.17 150 / .25); }
.cdchat__close { margin-left: auto; color: #fff; font-size: 26px; width: 40px; height: 40px; border-radius: 50%; line-height: 1; }
.cdchat__close:hover { background: oklch(1 0 0 / .1); }
.cdchat__log { flex: 1; overflow-y: auto; padding: 1rem; display: flex; flex-direction: column; gap: .6rem; background: var(--color-bg); overscroll-behavior: contain; }
.cdchat__msg { max-width: 85%; padding: .65rem .9rem; border-radius: 16px; font-size: 14px; line-height: 1.45; animation: cdin .35s cubic-bezier(.16,1,.3,1); }
@keyframes cdin { from { opacity: 0; transform: translateY(8px); } }
.cdchat__msg--bot { background: var(--color-surface); color: var(--color-text); border: 1px solid var(--color-border); border-bottom-left-radius: 4px; align-self: flex-start; }
.cdchat__msg--me { background: var(--color-primary); color: #fff; border-bottom-right-radius: 4px; align-self: flex-end; }
.cdchat__links { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .5rem; }
.cdchat__links a { font-size: 13px; padding: .3rem .7rem; border-radius: 999px; background: var(--color-tint); color: var(--color-text); text-decoration: none; font-weight: 600; }
.cdchat__links a:hover { background: var(--color-primary); color: #fff; }
.cdchat__typing { display: flex; gap: 4px; padding: .8rem .9rem; }
.cdchat__typing span { width: 7px; height: 7px; border-radius: 50%; background: var(--color-muted); animation: cddot 1s infinite; }
.cdchat__typing span:nth-child(2) { animation-delay: .15s; } .cdchat__typing span:nth-child(3) { animation-delay: .3s; }
@keyframes cddot { 0%, 60%, 100% { opacity: .3; transform: none; } 30% { opacity: 1; transform: translateY(-3px); } }
.cdchat__quick { display: flex; flex-wrap: wrap; gap: .4rem; padding: .6rem 1rem 0; background: var(--color-bg); }
.cdchat__quick:empty { display: none; }
.cdchat__quick button { font-size: 13px; padding: .4rem .75rem; border-radius: 999px; border: 1px solid var(--color-primary); color: var(--color-primary); background: var(--color-surface); font-weight: 500; animation: cdin .4s cubic-bezier(.16,1,.3,1); }
.cdchat__quick button:hover { background: var(--color-primary); color: #fff; }
.cdchat__form { display: flex; gap: .5rem; padding: .75rem; background: var(--color-bg); border-top: 1px solid var(--color-border); }
.cdchat__form input { flex: 1; min-height: 44px; border: 1px solid var(--color-border); border-radius: 999px; padding: 0 1rem; background: var(--color-surface); font-size: 15px; }
.cdchat__form input:focus { outline: none; border-color: var(--color-primary); }
.cdchat__form button { width: 44px; height: 44px; border-radius: 50%; background: var(--color-ink); color: #fff; display: grid; place-items: center; }
.cdchat__form button svg { width: 18px; height: 18px; }
.cdchat__form button:hover { background: var(--color-primary); }
@media (max-width: 480px) { .cdchat { right: 14px; bottom: 14px; } .cdchat__panel { position: fixed; inset: auto 8px 86px 8px; width: auto; height: calc(100dvh - 110px); } }
@media (prefers-reduced-motion: reduce) { .cdchat__fab::before { animation: none; } }
.cdchat__panel[hidden] { display: none; }