#dvw-root, #dvw-root * { box-sizing: border-box; font-family: 'Inter', -apple-system, BlinkMacSystemFont, Segoe UI, sans-serif; }
    #dvw-root { position: fixed; right: 20px; bottom: 20px; z-index: 99999; }

    #dvw-bubble-icon-chat, #dvw-bubble-icon-close { transition: stroke 0.3s ease; }
    #dvw-bubble {
        position: relative; width: 60px; height: 60px; border-radius: 50%; cursor: pointer;
        display: flex; align-items: center; justify-content: center; overflow: hidden;
        color: #16170f; transition: transform 0.18s ease, box-shadow 0.18s ease;
        /* Liquid-glass with a touch of the banner blue (#048ED3) */
        background: linear-gradient(155deg, rgba(255,255,255,0.55) 0%, rgba(255,255,255,0.18) 45%, rgba(4,142,211,0.16) 100%);
        backdrop-filter: blur(14px) saturate(160%);
        -webkit-backdrop-filter: blur(14px) saturate(160%);
        border: 1px solid rgba(255,255,255,0.6);
        box-shadow:
            0 8px 22px rgba(16,17,15,0.18),
            inset 0 1px 1px rgba(255,255,255,0.9),
            inset 0 -6px 10px rgba(4,142,211,0.1);
    }
    #dvw-bubble-shine {
        position: absolute; top: -30%; left: -20%; width: 70%; height: 70%;
        background: radial-gradient(circle, rgba(255,255,255,0.85) 0%, rgba(255,255,255,0) 70%);
        border-radius: 50%; pointer-events: none;
    }
    #dvw-bubble svg { position: relative; z-index: 1; filter: drop-shadow(0 1px 1px rgba(255,255,255,0.4)); }
    #dvw-bubble:hover { transform: scale(1.07); box-shadow: 0 10px 26px rgba(16,17,15,0.22), inset 0 1px 1px rgba(255,255,255,0.9), inset 0 -6px 10px rgba(4,142,211,0.14); }

    #dvw-eyes {
        position: absolute; top: 12px; left: 50%; transform: translateX(-50%) scale(0);
        opacity: 0; display: flex; gap: 5px; z-index: 10; pointer-events: none;
        transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), top 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), opacity 0.3s ease;
    }
    #dvw-root.dvw-is-peeking #dvw-eyes,
    #dvw-root.dvw-is-stopping #dvw-eyes {
        top: 6px; opacity: 1; transform: translateX(-50%) scale(1.4);
    }
    #dvw-bubble-icon-chat {
    }
    #dvw-root.dvw-open #dvw-eyes { display: none; }

    .dvw-eye {
        width: 15px; height: 15px; background: #fff; border-radius: 50%;
        border: 1px solid #c2c0b5;
        position: relative; overflow: hidden;
        box-shadow: 0 2px 4px rgba(0,0,0,0.12);
        transition: height 0.2s ease, margin-top 0.2s ease, border-radius 0.2s ease;
    }
    #dvw-root.dvw-is-peeking .dvw-eye,
    #dvw-root.dvw-is-stopping .dvw-eye {
        height: 6px; margin-top: 4.5px; border-radius: 6px;
    }
    .dvw-pupil {
        width: 6.5px; height: 6.5px; background: #16170f; border-radius: 50%;
        position: absolute; top: 50%; left: 50%;
        margin-top: -3.25px; margin-left: -3.25px;
        animation: dvw-eyes-look 8s infinite;
        transition: transform 0.2s ease;
    }
    #dvw-root.dvw-is-peeking .dvw-pupil {
        animation: none !important;
        transform: translate(-3.5px, 0) !important;
    }
    #dvw-root.dvw-is-stopping .dvw-pupil {
        animation: none !important;
        transform: translate(0, 0) !important;
    }

    @keyframes dvw-eyes-look {
        0%, 35% { transform: translate(0, 0); }
        40%, 80% { transform: translate(-3.5px, 0); }
        85%, 100% { transform: translate(0, 0); }
    }

    #dvw-wave {
        position: absolute; top: -6px; left: -6px; font-size: 22px; line-height: 1;
        pointer-events: none; z-index: 2; transform: scale(0) rotate(0deg); transform-origin: 70% 70%;
        filter: drop-shadow(0 2px 3px rgba(0,0,0,0.2));
    }
    #dvw-wave.dvw-wave-play { animation: dvw-wave-pop 1.8s ease-in-out; }
    @keyframes dvw-wave-pop {
        0%   { transform: scale(0) rotate(0deg); opacity: 0; }
        15%  { transform: scale(1) rotate(-10deg); opacity: 1; }
        25%  { transform: scale(1) rotate(14deg); }
        35%  { transform: scale(1) rotate(-10deg); }
        45%  { transform: scale(1) rotate(14deg); }
        55%  { transform: scale(1) rotate(0deg); }
        80%  { transform: scale(1) rotate(0deg); opacity: 1; }
        100% { transform: scale(0) rotate(0deg); opacity: 0; }
    }

    #dvw-panel {
        display: none; position: absolute; right: 0; bottom: 72px;
        width: 360px; max-width: calc(100vw - 32px); height: 520px; max-height: calc(100vh - 110px);
        background: #f6f5f1; border-radius: 16px; overflow: hidden;
        box-shadow: 0 12px 36px rgba(0,0,0,0.22);
        flex-direction: column;
    }
    #dvw-root.dvw-open #dvw-panel { display: flex; }

    #dvw-header {
        background: #048ED3; color: #fff; padding: 14px 16px;
        display: flex; align-items: center; justify-content: space-between; flex-shrink: 0;
    }
    #dvw-title { font-size: 15px; font-weight: 700; letter-spacing: -0.01em; }
    #dvw-status { font-size: 11.5px; color: #d6f3ff; display: flex; align-items: center; gap: 5px; margin-top: 2px; }
    #dvw-status span { width: 6px; height: 6px; border-radius: 50%; background: #4caf50; display: inline-block; }
    #dvw-header-actions { display: flex; align-items: center; gap: 2px; }
    #dvw-newchat, #dvw-close { background: none; border: none; color: rgba(255,255,255,0.85); cursor: pointer; padding: 6px; display: flex; border-radius: 6px; }
    #dvw-newchat:hover, #dvw-close:hover { color: #fff; background: rgba(255,255,255,0.16); }

    #dvw-messages { flex: 1; overflow-y: auto; padding: 14px; display: flex; flex-direction: column; gap: 10px; }
    #dvw-welcome { font-size: 13.5px; font-weight: 500; color: #2e2e26; background: #fff; border: 1px solid #e8e6df; border-radius: 12px; padding: 10px 12px; }

    .dvw-msg { max-width: 84%; font-size: 14px; font-weight: 500; line-height: 1.5; padding: 9px 13px; border-radius: 13px; word-wrap: break-word; white-space: pre-wrap; }
    .dvw-msg.dvw-user { align-self: flex-end; background: #048ED3; color: #fff; border-bottom-right-radius: 4px; }
    .dvw-msg.dvw-bot { align-self: flex-start; background: #fff; border: 1px solid #e8e6df; color: #14140f; border-bottom-left-radius: 4px; }

    /* Referral actions shown when the daily chat limit is reached */
    .dvw-actions { align-self: flex-start; display: flex; flex-wrap: wrap; gap: 8px; max-width: 84%; }
    .dvw-action-btn {
        display: inline-flex; align-items: center; gap: 6px;
        font-size: 13px; font-weight: 600; text-decoration: none;
        padding: 8px 13px; border-radius: 20px; border: 1px solid #cfeafb;
        background: #eaf6fd; color: #036ca3; transition: background 0.15s ease, transform 0.15s ease;
    }
    .dvw-action-btn:hover { background: #d8eefb; transform: translateY(-1px); }
    .dvw-action-btn.primary { background: linear-gradient(135deg, #048ED3, #036ca3); color: #fff; border: none; }
    .dvw-action-btn.primary:hover { background: linear-gradient(135deg, #036ca3, #02568a); }
    .dvw-action-btn svg { flex-shrink: 0; }

    #dvw-typing { padding: 0 14px 6px; display: flex; gap: 4px; align-items: center; }
    #dvw-typing span { width: 6px; height: 6px; border-radius: 50%; background: #9bd4ec; animation: dvw-bounce 1.2s infinite; }
    #dvw-typing span:nth-child(2) { animation-delay: 0.15s; }
    #dvw-typing span:nth-child(3) { animation-delay: 0.3s; }
    @keyframes dvw-bounce { 0%, 60%, 100% { transform: translateY(0); opacity: 0.5; } 30% { transform: translateY(-4px); opacity: 1; } }

    #dvw-form { display: flex; gap: 8px; padding: 10px; border-top: 1px solid #e8e6df; background: #fff; flex-shrink: 0; }
    #dvw-input { flex: 1; border: 1px solid #e2e0d6; border-radius: 20px; padding: 9px 14px; font-size: 13.5px; outline: none; }
    #dvw-input:focus { border-color: #048ED3; }
    #dvw-send { width: 36px; height: 36px; border-radius: 50%; border: none; background: #048ED3; color: #fff; cursor: pointer; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
    #dvw-send:disabled { opacity: 0.5; cursor: default; }

    @media (max-width: 480px) {
        #dvw-panel { width: calc(100vw - 24px); right: -8px; }
        /* 16px prevents iOS Safari's auto-zoom-on-focus for inputs under 16px */
        #dvw-input { font-size: 16px; }
    }

/* ══════════════════════════════════════════════════════
   Flight-flow additions: starter chips, add-on proposal cards, contextual nudge.

   The proposal card is a compact sibling of the page's .t-addon-card — same radii, same amber
   Add button, same type scale — sized for the 360px panel. It should read as the same product
   surfacing in a different place, which is the whole point of the integration.

   This widget is injected on every front-facing page, including ones that never load
   1860-theme.css, so it cannot rely on the --* tokens. Values below are the token values
   literally: #003087 navy, #048ED3 blue, #F3A316 amber (#d4880e hover), #7a4f00 amber-text.
══════════════════════════════════════════════════════ */

/* ── Starter chips ── */
#dvw-chips { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 10px 8px; }
#dvw-chips:empty { display: none; }
.dvw-chip {
    font-family: inherit; font-size: 12.5px; font-weight: 600;
    padding: 7px 12px; border-radius: 16px; cursor: pointer;
    background: #eaf6fd; color: #036ca3; border: 1px solid #cfeafb;
    transition: background 0.15s ease;
    text-align: left; line-height: 1.3;
}
.dvw-chip:hover { background: #d8eefb; }
.dvw-chip:focus-visible { outline: 2px solid #048ED3; outline-offset: 2px; }

/* ── Add-on proposal cards ── */
.dvw-proposals {
    align-self: flex-start; display: flex; flex-direction: column; gap: 8px;
    max-width: 92%; width: 92%;
}
.dvw-proposal {
    background: #f1efe9; border: 1px solid #e8e6df; border-radius: 12px;
    overflow: hidden; display: flex; flex-direction: column;
}
.dvw-proposal-img {
    width: 100%; aspect-ratio: 16 / 9; object-fit: cover; display: block;
    background: #ece9e1;
}
.dvw-proposal-body { padding: 10px 11px; display: flex; flex-direction: column; gap: 3px; }
.dvw-proposal-title {
    font-size: 13.5px; font-weight: 700; color: #14140f; line-height: 1.3;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.dvw-proposal-sub { font-size: 11.5px; color: #6b6c5e; }
.dvw-proposal-price { display: flex; align-items: baseline; gap: 5px; margin-top: 3px; }
.dvw-proposal-amount { font-size: 15px; font-weight: 800; color: #003087; }
.dvw-proposal-qualifier { font-size: 11px; color: #6b6c5e; }

.dvw-proposal-add {
    margin-top: 8px; min-height: 40px; width: 100%;
    display: inline-flex; align-items: center; justify-content: center;
    border: none; border-radius: 8px; cursor: pointer; text-decoration: none;
    background: #F3A316; color: #16170f;
    font-family: inherit; font-size: 13.5px; font-weight: 700;
    transition: background 0.15s ease, opacity 0.15s ease;
}
.dvw-proposal-add:hover:not(:disabled) { background: #d4880e; }
.dvw-proposal-add:focus-visible { outline: 2px solid #048ED3; outline-offset: 2px; }
.dvw-proposal-add:disabled { opacity: 0.65; cursor: default; }
.dvw-proposal-add.is-added { background: #ece9e1; color: #6b6c5e; }

/* ── Contextual nudge ── */
#dvw-nudge {
    position: absolute; right: 74px; bottom: 8px;
    display: flex; align-items: center; gap: 8px;
    background: #fff; color: #14140f;
    font-size: 13px; font-weight: 600; line-height: 1.35;
    padding: 10px 12px; border-radius: 12px;
    border: 1px solid #e8e6df;
    box-shadow: 0 6px 20px rgba(16,17,15,0.16);
    white-space: nowrap; cursor: pointer;
    opacity: 0; transform: translateX(6px);
    transition: opacity 0.25s ease, transform 0.25s ease;
    pointer-events: none;
}
#dvw-nudge.is-visible { opacity: 1; transform: translateX(0); pointer-events: auto; }
#dvw-nudge-close {
    border: none; background: transparent; cursor: pointer;
    color: #6b6c5e; font-size: 17px; line-height: 1;
    padding: 0 2px; flex-shrink: 0;
}
#dvw-nudge-close:hover { color: #14140f; }
#dvw-nudge-close:focus-visible { outline: 2px solid #048ED3; outline-offset: 2px; }

/* On narrow screens a nudge beside the bubble would run off-screen — sit it above instead. */
@media (max-width: 480px) {
    #dvw-nudge {
        right: 0; bottom: 76px; white-space: normal; max-width: calc(100vw - 40px);
    }
}

@media (prefers-reduced-motion: reduce) {
    #dvw-nudge, .dvw-chip, .dvw-proposal-add { transition: none; }
}
