.site-chat {
    --site-chat-accent: #38dfc4;
    --site-chat-blue: #448fff;
    position: fixed;
    z-index: 1090;
    right: max(1rem, env(safe-area-inset-right));
    bottom: max(1rem, env(safe-area-inset-bottom));
    color: #eef4ff;
    font-family: inherit;
}

.site-chat button,
.site-chat textarea {
    font: inherit;
}

.site-chat__launcher {
    position: relative;
    display: flex;
    min-width: 3.75rem;
    height: 3.75rem;
    align-items: center;
    justify-content: center;
    gap: .55rem;
    padding: 0 1.05rem;
    border: 1px solid rgba(111, 238, 218, .34);
    border-radius: 999px;
    color: #07110f;
    background: linear-gradient(135deg, #65f0d8, #32cdb7 48%, #5ba3ff 145%);
    box-shadow: 0 16px 44px rgba(0, 0, 0, .42), 0 0 0 6px rgba(56, 223, 196, .08);
    transition: transform .2s ease, box-shadow .2s ease;
}

.site-chat__launcher:hover {
    transform: translateY(-2px);
    box-shadow: 0 20px 52px rgba(0, 0, 0, .5), 0 0 0 7px rgba(56, 223, 196, .1);
}

.site-chat__launcher:focus-visible,
.site-chat__panel button:focus-visible,
.site-chat__composer textarea:focus-visible {
    outline: 3px solid rgba(102, 177, 255, .72);
    outline-offset: 3px;
}

.site-chat__launcher svg {
    width: 1.45rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.site-chat__launcher-label {
    font-size: .87rem;
    font-weight: 850;
}

.site-chat__launcher-close {
    display: none;
}

.site-chat__launcher-pulse {
    position: absolute;
    top: -.08rem;
    right: .12rem;
    width: .72rem;
    height: .72rem;
    border: 2px solid #07110f;
    border-radius: 50%;
    background: #fff;
}

.site-chat.is-open .site-chat__launcher-chat,
.site-chat.is-open .site-chat__launcher-label,
.site-chat.is-open .site-chat__launcher-pulse {
    display: none;
}

.site-chat.is-open .site-chat__launcher-close {
    display: block;
}

.site-chat.is-open .site-chat__launcher {
    min-width: 3.3rem;
    width: 3.3rem;
    height: 3.3rem;
    margin-left: auto;
    padding: 0;
}

.site-chat__panel {
    position: absolute;
    right: 0;
    bottom: 4.65rem;
    display: grid;
    width: min(25rem, calc(100vw - 2rem));
    height: min(40rem, calc(100vh - 7rem));
    grid-template-rows: auto minmax(0, 1fr) auto auto auto;
    overflow: hidden;
    border: 1px solid rgba(145, 172, 211, .2);
    border-radius: 1.25rem;
    visibility: hidden;
    opacity: 0;
    background:
        radial-gradient(28rem 20rem at 90% -10%, rgba(68, 143, 255, .17), transparent 66%),
        linear-gradient(160deg, rgba(15, 22, 34, .99), rgba(7, 11, 18, .995));
    box-shadow: 0 28px 90px rgba(0, 0, 0, .62), inset 0 1px rgba(255, 255, 255, .045);
    transform: translateY(1rem) scale(.97);
    transform-origin: bottom right;
    transition: opacity .2s ease, transform .2s ease, visibility .2s;
}

.site-chat.is-open .site-chat__panel {
    visibility: visible;
    opacity: 1;
    transform: translateY(0) scale(1);
}

.site-chat__header {
    display: flex;
    min-height: 4.8rem;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: .9rem 1rem;
    border-bottom: 1px solid rgba(255, 255, 255, .08);
    background: rgba(255, 255, 255, .018);
}

.site-chat__identity {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: .7rem;
}

.site-chat__identity > span:last-child {
    display: grid;
    min-width: 0;
    gap: .14rem;
}

.site-chat__identity strong {
    overflow: hidden;
    font-size: .92rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.site-chat__identity small {
    display: flex;
    align-items: center;
    gap: .38rem;
    color: #8e9db3;
    font-size: .68rem;
}

.site-chat__identity small i {
    width: .46rem;
    height: .46rem;
    border-radius: 50%;
    background: var(--site-chat-accent);
    box-shadow: 0 0 0 4px rgba(56, 223, 196, .1);
}

.site-chat__identity small i.is-offline {
    background: #758096;
    box-shadow: none;
}

.site-chat__avatar {
    display: grid;
    flex: 0 0 auto;
    width: 2.55rem;
    height: 2.55rem;
    place-items: center;
    border: 1px solid rgba(92, 234, 211, .24);
    border-radius: .82rem;
    color: #74edd9;
    background: linear-gradient(145deg, rgba(56, 223, 196, .14), rgba(68, 143, 255, .1));
}

.site-chat__avatar svg,
.site-chat__header-actions svg,
.site-chat__composer svg {
    width: 1.3rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.site-chat__header-actions {
    display: flex;
    gap: .2rem;
}

.site-chat__header-actions button {
    display: grid;
    width: 2.25rem;
    height: 2.25rem;
    place-items: center;
    border: 0;
    border-radius: .62rem;
    color: #91a0b6;
    background: transparent;
}

.site-chat__header-actions button:hover {
    color: #fff;
    background: rgba(255, 255, 255, .07);
}

.site-chat__messages {
    display: flex;
    min-height: 0;
    flex-direction: column;
    gap: .9rem;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 1rem;
    scrollbar-color: rgba(132, 151, 181, .38) transparent;
}

.site-chat__welcome {
    display: flex;
    align-items: flex-start;
    gap: .72rem;
    padding: .95rem;
    border: 1px solid rgba(255, 255, 255, .075);
    border-radius: .95rem;
    background: rgba(255, 255, 255, .027);
}

.site-chat__welcome-mark,
.site-chat__message-avatar {
    display: grid;
    flex: 0 0 auto;
    width: 2rem;
    height: 2rem;
    place-items: center;
    border-radius: .65rem;
    color: #70ebd7;
    background: rgba(56, 223, 196, .1);
    font-size: .62rem;
    font-weight: 900;
}

.site-chat__welcome h2 {
    margin: .05rem 0 .35rem;
    color: #f3f7ff;
    font-size: .94rem;
    font-weight: 760;
    line-height: 1.35;
}

.site-chat__welcome p {
    margin: 0;
    color: #9aa8ba;
    font-size: .78rem;
    line-height: 1.52;
}

.site-chat__suggestions {
    display: grid;
    gap: .48rem;
}

.site-chat__suggestions button {
    min-height: 2.45rem;
    padding: .58rem .72rem;
    border: 1px solid rgba(122, 157, 209, .17);
    border-radius: .72rem;
    color: #c9d5e6;
    background: rgba(61, 87, 124, .09);
    font-size: .73rem;
    text-align: left;
    transition: border-color .18s, background .18s, color .18s;
}

.site-chat__suggestions button:hover {
    border-color: rgba(56, 223, 196, .3);
    color: #fff;
    background: rgba(56, 223, 196, .07);
}

.site-chat__message {
    display: flex;
    align-items: flex-end;
    gap: .5rem;
    max-width: 92%;
}

.site-chat__message--user {
    align-self: flex-end;
    flex-direction: row-reverse;
}

.site-chat__message--assistant {
    align-self: flex-start;
}

.site-chat__message-avatar {
    width: 1.72rem;
    height: 1.72rem;
    border-radius: .55rem;
    font-size: .54rem;
}

.site-chat__message--user .site-chat__message-avatar {
    color: #d7e8ff;
    background: rgba(68, 143, 255, .18);
}

.site-chat__bubble {
    padding: .72rem .82rem;
    border: 1px solid rgba(255, 255, 255, .07);
    border-radius: .92rem .92rem .92rem .28rem;
    color: #dce5f3;
    background: rgba(255, 255, 255, .045);
    font-size: .79rem;
    line-height: 1.55;
    overflow-wrap: anywhere;
    white-space: pre-wrap;
}

.site-chat__message--user .site-chat__bubble {
    border-color: rgba(86, 152, 255, .22);
    border-radius: .92rem .92rem .28rem .92rem;
    color: #f2f7ff;
    background: linear-gradient(145deg, rgba(55, 119, 220, .42), rgba(45, 91, 167, .36));
}

.site-chat__bubble a {
    color: #71ead7;
    text-decoration-color: rgba(113, 234, 215, .45);
    text-underline-offset: .14em;
}

.site-chat__typing {
    display: flex;
    min-width: 3.25rem;
    align-items: center;
    gap: .26rem;
    padding-block: .87rem;
}

.site-chat__typing i {
    width: .34rem;
    height: .34rem;
    border-radius: 50%;
    background: #8ea0b8;
    animation: site-chat-typing 1.15s infinite ease-in-out;
}

.site-chat__typing i:nth-child(2) { animation-delay: .14s; }
.site-chat__typing i:nth-child(3) { animation-delay: .28s; }

@keyframes site-chat-typing {
    0%, 65%, 100% { opacity: .35; transform: translateY(0); }
    32% { opacity: 1; transform: translateY(-.22rem); }
}

.site-chat__error {
    margin: 0 .9rem .55rem;
    padding: .58rem .7rem;
    border: 1px solid rgba(255, 116, 135, .24);
    border-radius: .65rem;
    color: #ffc1ca;
    background: rgba(185, 39, 63, .12);
    font-size: .7rem;
}

.site-chat__composer {
    display: flex;
    align-items: flex-end;
    gap: .5rem;
    margin: 0 .8rem;
    padding: .5rem .52rem .5rem .78rem;
    border: 1px solid rgba(139, 164, 201, .2);
    border-radius: .9rem;
    background: rgba(255, 255, 255, .04);
    transition: border-color .18s, box-shadow .18s;
}

.site-chat__composer:focus-within {
    border-color: rgba(56, 223, 196, .36);
    box-shadow: 0 0 0 3px rgba(56, 223, 196, .06);
}

.site-chat__composer textarea {
    width: 100%;
    min-height: 2.25rem;
    max-height: 7rem;
    resize: none;
    overflow-y: auto;
    border: 0;
    outline: 0;
    color: #eef4ff;
    background: transparent;
    font-size: .8rem;
    line-height: 1.45;
}

.site-chat__composer textarea::placeholder {
    color: #75849a;
}

.site-chat__composer button {
    display: grid;
    flex: 0 0 auto;
    width: 2.25rem;
    height: 2.25rem;
    place-items: center;
    border: 0;
    border-radius: .7rem;
    color: #06110f;
    background: linear-gradient(135deg, #62ecd5, #37cfb8);
}

.site-chat__composer button:disabled {
    cursor: not-allowed;
    opacity: .38;
}

.site-chat__composer button svg {
    width: 1.15rem;
}

.site-chat__note {
    margin: .52rem .8rem .72rem;
    color: #67758a;
    font-size: .61rem;
    line-height: 1.35;
    text-align: center;
}

@media (max-width: 575.98px) {
    .site-chat {
        right: max(.7rem, env(safe-area-inset-right));
        bottom: max(.7rem, env(safe-area-inset-bottom));
    }

    .site-chat__panel {
        position: fixed;
        inset: max(.65rem, env(safe-area-inset-top)) max(.65rem, env(safe-area-inset-right)) max(5rem, calc(4.5rem + env(safe-area-inset-bottom))) max(.65rem, env(safe-area-inset-left));
        width: auto;
        height: auto;
        max-height: none;
        border-radius: 1.05rem;
    }

    .site-chat__launcher-label {
        display: none;
    }

    .site-chat__launcher {
        min-width: 3.5rem;
        width: 3.5rem;
        height: 3.5rem;
        padding: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .site-chat__launcher,
    .site-chat__panel,
    .site-chat__typing i {
        transition: none;
        animation: none;
    }
}